@openedx/paragon 22.3.2 → 23.0.0-alpha.1

package/dist/Tabs/index.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 .pgn__tabs {
   flex-wrap: nowrap;
 
@@ -11,9 +9,9 @@
     position: absolute;
     top: 0;
     right: 0;
-    min-height: $tab-notification-height;
-    min-width: $tab-notification-width;
-    font-size: $tab-notification-font-size;
+    min-height: var(--pgn-size-tabs-notification-height);
+    min-width: var(--pgn-size-tabs-notification-width);
+    font-size: var(--pgn-typography-tabs-notification-font-size);
   }
 
   .pgn__tab_more.nav-link {
@@ -32,28 +30,29 @@
       margin: 0;
 
       .dropdown .dropdown-toggle {
-        padding: $tab-more-link-dropdown-toggle-padding-x $tab-more-link-dropdown-toggle-padding-y;
+        // stylelint-disable-next-line max-line-length
+        padding: var(--pgn-spacing-tab-more-link-dropdown-toggle-padding-x) var(--pgn-spacing-tab-more-link-dropdown-toggle-padding-y);
 
         &:focus {
-          background-color: $tab-more-link-dropdown-toggle-focus-bg;
-          border-color: $tab-more-link-dropdown-toggle-focus-border-color;
-          color: $tab-more-link-dropdown-toggle-focus-color;
+          background-color: var(--pgn-color-tab-more-link-dropdown-toggle-bg-focus);
+          border-color: var(--pgn-color-tab-more-link-dropdown-toggle-border-focus);
+          color: var(--pgn-color-tab-more-link-dropdown-toggle-text-focus);
 
           &.btn.btn-link {
-            color: $tab-more-link-dropdown-toggle-btn-focus-color;
-            border-color: $tab-more-link-dropdown-toggle-btn-focus-border-color;
+            color: var(--pgn-color-tab-more-link-dropdown-toggle-btn-text-focus);
+            border-color: var(--pgn-color-tab-more-link-dropdown-toggle-btn-border-focus);
           }
         }
       }
 
       &.active {
         .dropdown .dropdown-toggle {
-          color: $tab-more-link-dropdown-toggle-active-color;
+          color: var(--pgn-color-tab-more-link-dropdown-toggle-text-active);
         }
 
         &:hover {
           .dropdown .dropdown-toggle {
-            background-color: $tab-more-link-dropdown-toggle-hover-color;
+            background-color: var(--pgn-color-tab-more-link-dropdown-toggle-text-hover);
           }
         }
       }
@@ -63,28 +62,29 @@
   // Nav inverse pills
   &.nav-inverse-pills .pgn__tab_more.nav-link {
     .dropdown .dropdown-toggle {
-      padding: $tab-inverse-pills-link-dropdown-toggle-padding-x $tab-inverse-pills-link-dropdown-toggle-padding-y;
+      // stylelint-disable-next-line max-line-length
+      padding: var(--pgn-spacing-tab-inverse-pills-link-dropdown-toggle-padding-x) var(--pgn-spacing-tab-inverse-pills-link-dropdown-toggle-padding-y);
       border: none;
 
       &:focus {
-        background-color: $tab-inverse-pills-link-dropdown-toggle-focus-bg;
-        color: $tab-inverse-pills-link-dropdown-toggle-focus-color;
+        background-color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-bg-focus);
+        color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-text-focus);
       }
     }
 
     &.active .dropdown .dropdown-toggle {
-      color: $tab-inverse-pills-link-dropdown-toggle-active-color;
+      color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-text-active);
 
       &:hover {
-        color: $tab-inverse-pills-link-dropdown-toggle-active-hover-color;
-        background-color: $tab-inverse-pills-link-dropdown-toggle-active-hover-bg;
+        color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-text-active-hover);
+        background-color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-bg-active-hover);
       }
 
       &:focus {
         @include nav-tabs-link-focus(
-          $tab-inverse-pills-link-dropdown-toggle-focus-border-color,
-          $nav-tabs-border-radius,
-          $tab-inverse-pills-link-dropdown-distance
+          var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-border-focus),
+          var(--pgn-size-nav-tabs-border-radius),
+          var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-distance)
         );
       }
     }
@@ -92,15 +92,16 @@
 
   // Nav tabs
   &.nav-tabs .pgn__tab_more.nav-link .dropdown .dropdown-toggle {
-    padding: .563rem $tab-more-link-dropdown-toggle-padding-y;
+    padding: .563rem var(--pgn-spacing-tab-more-link-dropdown-toggle-padding-y);
   }
 
   // Nav inverse tabs
   &.nav-inverse-tabs .pgn__tab_more.nav-link .dropdown .dropdown-toggle {
-    padding: $tab-inverse-tabs-link-dropdown-toggle-padding-x $tab-inverse-tabs-link-dropdown-toggle-padding-y;
+    // stylelint-disable-next-line max-line-length
+    padding: var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-padding-x) var(--pgn-spacing-tab-inverse-tabs-link-dropdown-toggle-padding-y);
 
     &:hover {
-      background-color: $tab-inverse-tabs-link-dropdown-toggle-hover-bg;
+      background-color: var(--pgn-color-tab-inverse-pills-link-dropdown-toggle-bg-hover);
     }
   }
 

package/dist/Toast/ToastContainer.js

@@ -1,15 +1,15 @@
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
 function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 import React from 'react';
 import ReactDOM from 'react-dom';

package/dist/Toast/ToastContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastContainer.js","names":["React","ReactDOM","PropTypes","ToastContainer","_React$Component","_inherits","_super","_createSuper","props","_this","_classCallCheck","call","toastRootName","document","rootElement","getElementById","createElement","setAttribute","body","appendChild","_createClass","key","value","render","createPortal","children","Component","propTypes","node","isRequired"],"sources":["../../src/Toast/ToastContainer.jsx"],"sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\n\nclass ToastContainer extends React.Component {\n  constructor(props) {\n    super(props);\n    this.toastRootName = 'toast-root';\n    if (typeof document === 'undefined') {\n      this.rootElement = null;\n    } else if (document.getElementById(this.toastRootName)) {\n      this.rootElement = document.getElementById(this.toastRootName);\n    } else {\n      const rootElement = document.createElement('div');\n      rootElement.setAttribute('id', this.toastRootName);\n      rootElement.setAttribute('class', 'toast-container');\n      rootElement.setAttribute('role', 'alert');\n      rootElement.setAttribute('aria-live', 'polite');\n      rootElement.setAttribute('aria-atomic', 'true');\n      this.rootElement = document.body.appendChild(rootElement);\n    }\n  }\n\n  render() {\n    if (this.rootElement) {\n      return ReactDOM.createPortal(\n        this.props.children,\n        this.rootElement,\n      );\n    }\n    return null;\n  }\n}\n\nToastContainer.propTypes = {\n  /** Specifies contents of the component. */\n  children: PropTypes.node.isRequired,\n};\n\nexport default ToastContainer;\n"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,QAAQ,MAAM,WAAW;AAChC,OAAOC,SAAS,MAAM,YAAY;AAAC,IAE7BC,cAAc,0BAAAC,gBAAA;EAAAC,SAAA,CAAAF,cAAA,EAAAC,gBAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,cAAA;EAClB,SAAAA,eAAYK,KAAK,EAAE;IAAA,IAAAC,KAAA;IAAAC,eAAA,OAAAP,cAAA;IACjBM,KAAA,GAAAH,MAAA,CAAAK,IAAA,OAAMH,KAAK;IACXC,KAAA,CAAKG,aAAa,GAAG,YAAY;IACjC,IAAI,OAAOC,QAAQ,KAAK,WAAW,EAAE;MACnCJ,KAAA,CAAKK,WAAW,GAAG,IAAI;IACzB,CAAC,MAAM,IAAID,QAAQ,CAACE,cAAc,CAACN,KAAA,CAAKG,aAAa,CAAC,EAAE;MACtDH,KAAA,CAAKK,WAAW,GAAGD,QAAQ,CAACE,cAAc,CAACN,KAAA,CAAKG,aAAa,CAAC;IAChE,CAAC,MAAM;MACL,IAAME,WAAW,GAAGD,QAAQ,CAACG,aAAa,CAAC,KAAK,CAAC;MACjDF,WAAW,CAACG,YAAY,CAAC,IAAI,EAAER,KAAA,CAAKG,aAAa,CAAC;MAClDE,WAAW,CAACG,YAAY,CAAC,OAAO,EAAE,iBAAiB,CAAC;MACpDH,WAAW,CAACG,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC;MACzCH,WAAW,CAACG,YAAY,CAAC,WAAW,EAAE,QAAQ,CAAC;MAC/CH,WAAW,CAACG,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC;MAC/CR,KAAA,CAAKK,WAAW,GAAGD,QAAQ,CAACK,IAAI,CAACC,WAAW,CAACL,WAAW,CAAC;IAC3D;IAAC,OAAAL,KAAA;EACH;EAACW,YAAA,CAAAjB,cAAA;IAAAkB,GAAA;IAAAC,KAAA,EAED,SAAAC,OAAA,EAAS;MACP,IAAI,IAAI,CAACT,WAAW,EAAE;QACpB,oBAAOb,QAAQ,CAACuB,YAAY,CAC1B,IAAI,CAAChB,KAAK,CAACiB,QAAQ,EACnB,IAAI,CAACX,WACP,CAAC;MACH;MACA,OAAO,IAAI;IACb;EAAC;EAAA,OAAAX,cAAA;AAAA,EA3B0BH,KAAK,CAAC0B,SAAS;AA8B5CvB,cAAc,CAACwB,SAAS,GAAG;EACzB;EACAF,QAAQ,EAAEvB,SAAS,CAAC0B,IAAI,CAACC;AAC3B,CAAC;AAED,eAAe1B,cAAc"}
+{"version":3,"file":"ToastContainer.js","names":["React","ReactDOM","PropTypes","ToastContainer","_React$Component","_inherits","_super","_createSuper","props","_this","_classCallCheck","call","toastRootName","document","rootElement","getElementById","createElement","setAttribute","body","appendChild","_createClass","key","value","render","createPortal","children","Component","propTypes","node","isRequired"],"sources":["../../src/Toast/ToastContainer.jsx"],"sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\n\nclass ToastContainer extends React.Component {\n  constructor(props) {\n    super(props);\n    this.toastRootName = 'toast-root';\n    if (typeof document === 'undefined') {\n      this.rootElement = null;\n    } else if (document.getElementById(this.toastRootName)) {\n      this.rootElement = document.getElementById(this.toastRootName);\n    } else {\n      const rootElement = document.createElement('div');\n      rootElement.setAttribute('id', this.toastRootName);\n      rootElement.setAttribute('class', 'toast-container');\n      rootElement.setAttribute('role', 'alert');\n      rootElement.setAttribute('aria-live', 'polite');\n      rootElement.setAttribute('aria-atomic', 'true');\n      this.rootElement = document.body.appendChild(rootElement);\n    }\n  }\n\n  render() {\n    if (this.rootElement) {\n      return ReactDOM.createPortal(\n        this.props.children,\n        this.rootElement,\n      );\n    }\n    return null;\n  }\n}\n\nToastContainer.propTypes = {\n  /** Specifies contents of the component. */\n  children: PropTypes.node.isRequired,\n};\n\nexport default ToastContainer;\n"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,QAAQ,MAAM,WAAW;AAChC,OAAOC,SAAS,MAAM,YAAY;AAAC,IAE7BC,cAAc,0BAAAC,gBAAA;EAAAC,SAAA,CAAAF,cAAA,EAAAC,gBAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,cAAA;EAClB,SAAAA,eAAYK,KAAK,EAAE;IAAA,IAAAC,KAAA;IAAAC,eAAA,OAAAP,cAAA;IACjBM,KAAA,GAAAH,MAAA,CAAAK,IAAA,OAAMH,KAAK;IACXC,KAAA,CAAKG,aAAa,GAAG,YAAY;IACjC,IAAI,OAAOC,QAAQ,KAAK,WAAW,EAAE;MACnCJ,KAAA,CAAKK,WAAW,GAAG,IAAI;IACzB,CAAC,MAAM,IAAID,QAAQ,CAACE,cAAc,CAACN,KAAA,CAAKG,aAAa,CAAC,EAAE;MACtDH,KAAA,CAAKK,WAAW,GAAGD,QAAQ,CAACE,cAAc,CAACN,KAAA,CAAKG,aAAa,CAAC;IAChE,CAAC,MAAM;MACL,IAAME,WAAW,GAAGD,QAAQ,CAACG,aAAa,CAAC,KAAK,CAAC;MACjDF,WAAW,CAACG,YAAY,CAAC,IAAI,EAAER,KAAA,CAAKG,aAAa,CAAC;MAClDE,WAAW,CAACG,YAAY,CAAC,OAAO,EAAE,iBAAiB,CAAC;MACpDH,WAAW,CAACG,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC;MACzCH,WAAW,CAACG,YAAY,CAAC,WAAW,EAAE,QAAQ,CAAC;MAC/CH,WAAW,CAACG,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC;MAC/CR,KAAA,CAAKK,WAAW,GAAGD,QAAQ,CAACK,IAAI,CAACC,WAAW,CAACL,WAAW,CAAC;IAC3D;IAAC,OAAAL,KAAA;EACH;EAACW,YAAA,CAAAjB,cAAA;IAAAkB,GAAA;IAAAC,KAAA,EAED,SAAAC,OAAA,EAAS;MACP,IAAI,IAAI,CAACT,WAAW,EAAE;QACpB,oBAAOb,QAAQ,CAACuB,YAAY,CAC1B,IAAI,CAAChB,KAAK,CAACiB,QAAQ,EACnB,IAAI,CAACX,WACP,CAAC;MACH;MACA,OAAO,IAAI;IACb;EAAC;EAAA,OAAAX,cAAA;AAAA,EA3B0BH,KAAK,CAAC0B,SAAS;AA8B5CvB,cAAc,CAACwB,SAAS,GAAG;EACzB;EACAF,QAAQ,EAAEvB,SAAS,CAAC0B,IAAI,CAACC;AAC3B,CAAC;AAED,eAAe1B,cAAc","ignoreList":[]}

package/dist/Toast/ToastContainer.scss

@@ -1,24 +1,22 @@
-@import "variables";
-
 .toast-container {
-  bottom: $toast-container-gutter-lg;
-  left: $toast-container-gutter-lg;
+  bottom: var(--pgn-spacing-toast-container-gutter-lg);
+  left: var(--pgn-spacing-toast-container-gutter-lg);
   position: fixed;
   z-index: 2;
 
   [dir="rtl"] & {
-    right: $toast-container-gutter-lg;
+    right: var(--pgn-spacing-toast-container-gutter-lg);
     left: 0;
   }
 
-  @media only screen and (max-width: 768px) {
-    bottom: $toast-container-gutter-sm;
-    right: $toast-container-gutter-sm;
-    left: $toast-container-gutter-sm;
+  @media (--pgn-size-breakpoint-max-width-sm) {
+    bottom: var(--pgn-spacing-toast-container-gutter-sm);
+    right: var(--pgn-spacing-toast-container-gutter-sm);
+    left: var(--pgn-spacing-toast-container-gutter-sm);
 
     [dir="rtl"] & {
-      left: $toast-container-gutter-sm;
-      right: $toast-container-gutter-sm;
+      left: var(--pgn-spacing-toast-container-gutter-sm);
+      right: var(--pgn-spacing-toast-container-gutter-sm);
     }
   }
 }

package/dist/Toast/bootstrap-toast.scss

@@ -0,0 +1,46 @@
+.toast {
+  flex-basis: var(--pgn-size-toast-max-width);
+  max-width: var(--pgn-size-toast-max-width);
+  color: var(--pgn-color-toast-base);
+  background-color: var(--pgn-color-toast-bg);
+  background-clip: padding-box;
+  border: var(--pgn-size-toast-border-width) solid var(--pgn-color-toast-border);
+  box-shadow: var(--pgn-elevation-toast-box-shadow);
+  opacity: 0;
+
+  @include font-size(var(--pgn-typography-toast-font-size));
+  @include border-radius(var(--pgn-size-toast-border-radius));
+
+  &:not(:last-child) {
+    margin-bottom: var(--pgn-spacing-toast-padding-x);
+  }
+
+  &.showing {
+    opacity: 1;
+  }
+
+  &.show {
+    display: block;
+    opacity: 1;
+  }
+
+  &.hide {
+    display: none;
+  }
+}
+
+.toast-header {
+  display: flex;
+  align-items: center;
+  padding: var(--pgn-spacing-toast-padding-y) var(--pgn-spacing-toast-padding-x);
+  color: var(--pgn-color-toast-header-text);
+  background-color: var(--pgn-color-toast-header-bg);
+  background-clip: padding-box;
+  border-bottom: var(--pgn-size-toast-border-width) solid var(--pgn-color-toast-header-border);
+
+  @include border-top-radius(subtract(var(--pgn-size-toast-border-radius), var(--pgn-size-toast-border-width)));
+}
+
+.toast-body {
+  padding: var(--pgn-spacing-toast-padding-x);
+}

package/dist/Toast/index.js

@@ -4,7 +4,7 @@ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArra
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

package/dist/Toast/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useState","classNames","PropTypes","BaseToast","useIntl","Close","ToastContainer","Button","Icon","IconButton","TOAST_CLOSE_LABEL_TEXT","TOAST_DELAY","Toast","_ref","action","children","className","closeLabel","onClose","show","rest","_objectWithoutProperties","_excluded","intl","_useState","_useState2","_slicedToArray","autoHide","setAutoHide","intlCloseLabel","formatMessage","id","defaultMessage","description","createElement","_extends","autohide","onBlur","onFocus","onMouseOut","onMouseOver","iconAs","alt","src","onClick","variant","invertColors","as","href","size","label","defaultProps","undefined","delay","propTypes","string","isRequired","func","bool","shape","number"],"sources":["../../src/Toast/index.jsx"],"sourcesContent":["import React, { useState } from 'react';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\n\nimport BaseToast from 'react-bootstrap/Toast';\nimport { useIntl } from 'react-intl';\n\nimport { Close } from '../../icons';\nimport ToastContainer from './ToastContainer';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport IconButton from '../IconButton';\n\nexport const TOAST_CLOSE_LABEL_TEXT = 'Close';\nexport const TOAST_DELAY = 5000;\n\nfunction Toast({\n  action, children, className, closeLabel, onClose, show, ...rest\n}) {\n  const intl = useIntl();\n  const [autoHide, setAutoHide] = useState(true);\n  const intlCloseLabel = closeLabel || intl.formatMessage({\n    id: 'pgn.Toast.closeLabel',\n    defaultMessage: 'Close',\n    description: 'Close label for Toast component',\n  });\n  return (\n    <ToastContainer>\n      <BaseToast\n        autohide={autoHide}\n        className={classNames('pgn__toast', className)}\n        onClose={onClose}\n        onBlur={() => setAutoHide(true)}\n        onFocus={() => setAutoHide(false)}\n        onMouseOut={() => setAutoHide(true)}\n        onMouseOver={() => setAutoHide(false)}\n        show={show}\n        {...rest}\n      >\n        <div\n          className=\"toast-header\"\n        >\n          <p className=\"small\">{children}</p>\n          <div className=\"toast-header-btn-container\">\n            <IconButton\n              iconAs={Icon}\n              alt={intlCloseLabel}\n              className=\"align-self-start\"\n              src={Close}\n              onClick={onClose}\n              variant=\"primary\"\n              invertColors\n            />\n          </div>\n        </div>\n        {action && (\n          <Button\n            as={action.href ? 'a' : 'button'}\n            href={action.href}\n            onClick={action.onClick}\n            size=\"sm\"\n            variant=\"inverse-outline-primary\"\n          >\n            {action.label}\n          </Button>\n        )}\n      </BaseToast>\n    </ToastContainer>\n  );\n}\n\nToast.defaultProps = {\n  action: null,\n  closeLabel: undefined,\n  delay: TOAST_DELAY,\n  className: undefined,\n};\n\nToast.propTypes = {\n  /** A string or an element that is rendered inside the main body of the `Toast`. */\n  children: PropTypes.string.isRequired,\n  /**\n   * A function that is called on close. It can be used to perform\n   * actions upon closing of the `Toast`, such as setting the \"show\"\n   * element to false.\n   * */\n  onClose: PropTypes.func.isRequired,\n  /** Boolean used to control whether the `Toast` shows */\n  show: PropTypes.bool.isRequired,\n  /**\n   * Fields used to build optional action button.\n   * `label` is a string rendered inside the button.\n   * `href` is a link that will render the action button as an anchor tag.\n   * `onClick` is a function that is called when the button is clicked.\n   */\n  action: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    href: PropTypes.string,\n    onClick: PropTypes.func,\n  }),\n  /**\n   * Alt text for the `Toast`'s dismiss button. Defaults to 'Close'.\n   */\n  closeLabel: PropTypes.string,\n  /** Time in milliseconds for which the `Toast` will display. */\n  delay: PropTypes.number,\n  /** Class names for the `BaseToast` component */\n  className: PropTypes.string,\n};\n\nexport default Toast;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useState","classNames","PropTypes","BaseToast","useIntl","Close","ToastContainer","Button","Icon","IconButton","TOAST_CLOSE_LABEL_TEXT","TOAST_DELAY","Toast","_ref","action","children","className","closeLabel","onClose","show","rest","_objectWithoutProperties","_excluded","intl","_useState","_useState2","_slicedToArray","autoHide","setAutoHide","intlCloseLabel","formatMessage","id","defaultMessage","description","createElement","_extends","autohide","onBlur","onFocus","onMouseOut","onMouseOver","iconAs","alt","src","onClick","variant","invertColors","as","href","size","label","defaultProps","undefined","delay","propTypes","string","isRequired","func","bool","shape","number"],"sources":["../../src/Toast/index.jsx"],"sourcesContent":["import React, { useState } from 'react';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\n\nimport BaseToast from 'react-bootstrap/Toast';\nimport { useIntl } from 'react-intl';\n\nimport { Close } from '../../icons';\nimport ToastContainer from './ToastContainer';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport IconButton from '../IconButton';\n\nexport const TOAST_CLOSE_LABEL_TEXT = 'Close';\nexport const TOAST_DELAY = 5000;\n\nfunction Toast({\n  action, children, className, closeLabel, onClose, show, ...rest\n}) {\n  const intl = useIntl();\n  const [autoHide, setAutoHide] = useState(true);\n  const intlCloseLabel = closeLabel || intl.formatMessage({\n    id: 'pgn.Toast.closeLabel',\n    defaultMessage: 'Close',\n    description: 'Close label for Toast component',\n  });\n  return (\n    <ToastContainer>\n      <BaseToast\n        autohide={autoHide}\n        className={classNames('pgn__toast', className)}\n        onClose={onClose}\n        onBlur={() => setAutoHide(true)}\n        onFocus={() => setAutoHide(false)}\n        onMouseOut={() => setAutoHide(true)}\n        onMouseOver={() => setAutoHide(false)}\n        show={show}\n        {...rest}\n      >\n        <div\n          className=\"toast-header\"\n        >\n          <p className=\"small\">{children}</p>\n          <div className=\"toast-header-btn-container\">\n            <IconButton\n              iconAs={Icon}\n              alt={intlCloseLabel}\n              className=\"align-self-start\"\n              src={Close}\n              onClick={onClose}\n              variant=\"primary\"\n              invertColors\n            />\n          </div>\n        </div>\n        {action && (\n          <Button\n            as={action.href ? 'a' : 'button'}\n            href={action.href}\n            onClick={action.onClick}\n            size=\"sm\"\n            variant=\"inverse-outline-primary\"\n          >\n            {action.label}\n          </Button>\n        )}\n      </BaseToast>\n    </ToastContainer>\n  );\n}\n\nToast.defaultProps = {\n  action: null,\n  closeLabel: undefined,\n  delay: TOAST_DELAY,\n  className: undefined,\n};\n\nToast.propTypes = {\n  /** A string or an element that is rendered inside the main body of the `Toast`. */\n  children: PropTypes.string.isRequired,\n  /**\n   * A function that is called on close. It can be used to perform\n   * actions upon closing of the `Toast`, such as setting the \"show\"\n   * element to false.\n   * */\n  onClose: PropTypes.func.isRequired,\n  /** Boolean used to control whether the `Toast` shows */\n  show: PropTypes.bool.isRequired,\n  /**\n   * Fields used to build optional action button.\n   * `label` is a string rendered inside the button.\n   * `href` is a link that will render the action button as an anchor tag.\n   * `onClick` is a function that is called when the button is clicked.\n   */\n  action: PropTypes.shape({\n    label: PropTypes.string.isRequired,\n    href: PropTypes.string,\n    onClick: PropTypes.func,\n  }),\n  /**\n   * Alt text for the `Toast`'s dismiss button. Defaults to 'Close'.\n   */\n  closeLabel: PropTypes.string,\n  /** Time in milliseconds for which the `Toast` will display. */\n  delay: PropTypes.number,\n  /** Class names for the `BaseToast` component */\n  className: PropTypes.string,\n};\n\nexport default Toast;\n"],"mappings":"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","ignoreList":[]}

package/dist/Toast/index.scss

@@ -1,13 +1,12 @@
-@import "variables";
-@import "~bootstrap/scss/toasts";
+@import "bootstrap-toast";
 
 .toast {
-  background-color: $toast-background-color;
-  box-shadow: $toast-box-shadow;
+  background-color: var(--pgn-color-toast-bg);
+  box-shadow: var(--pgn-elevation-toast-box-shadow);
   margin: 0;
   padding: 1rem;
   position: relative;
-  border-radius: $toast-border-radius;
+  border-radius: var(--pgn-size-toast-border-radius);
   z-index: 2;
 
   &.show {
@@ -32,7 +31,7 @@
     padding: 0;
 
     p {
-      font-size: $small-font-size;
+      font-size: var(--pgn-typography-font-size-small-base);
       margin: 0;
       padding-right: .75rem;
     }
@@ -42,12 +41,12 @@
     }
   }
 
-  @media only screen and (max-width: 768px) {
+  @media (--pgn-size-breakpoint-max-width-sm) {
     max-width: 100%;
   }
 
-  @media only screen and (min-width: 768px) {
-    min-width: $toast-max-width;
-    max-width: $toast-max-width;
+  @media (--pgn-size-breakpoint-min-width-md) {
+    min-width: var(--pgn-size-toast-max-width);
+    max-width: var(--pgn-size-toast-max-width);
   }
 }

package/dist/ToggleButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","ToggleButtonGroup"],"sources":["../../src/ToggleButton/index.jsx"],"sourcesContent":["export { default } from 'react-bootstrap/ToggleButton';\nexport { default as ToggleButtonGroup } from 'react-bootstrap/ToggleButtonGroup';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,8BAA8B;AACtD,SAASA,OAAO,IAAIC,iBAAiB,QAAQ,mCAAmC"}
+{"version":3,"file":"index.js","names":["default","ToggleButtonGroup"],"sources":["../../src/ToggleButton/index.jsx"],"sourcesContent":["export { default } from 'react-bootstrap/ToggleButton';\nexport { default as ToggleButtonGroup } from 'react-bootstrap/ToggleButtonGroup';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,8BAA8B;AACtD,SAASA,OAAO,IAAIC,iBAAiB,QAAQ,mCAAmC","ignoreList":[]}

package/dist/Tooltip/index.js

@@ -1,10 +1,10 @@
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 var _excluded = ["children", "variant"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

package/dist/Tooltip/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","classNames","BaseTooltip","PLACEMENT_VARIANTS","Tooltip","forwardRef","_ref","ref","children","variant","props","_objectWithoutProperties","_excluded","createElement","_extends","className","propTypes","_objectSpread","id","string","isRequired","placement","oneOf","arrowProps","shape","oneOfType","func","current","element","style","show","bool","popper","bsPrefix","node","defaultProps","undefined"],"sources":["../../src/Tooltip/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport BaseTooltip from 'react-bootstrap/Tooltip';\n\nconst PLACEMENT_VARIANTS = [\n  'auto-start',\n  'auto',\n  'auto-end',\n  'top-start',\n  'top',\n  'top-end',\n  'right-start',\n  'right',\n  'right-end',\n  'bottom-end',\n  'bottom',\n  'bottom-start',\n  'left-end',\n  'left',\n  'left-start',\n];\n\nconst Tooltip = React.forwardRef(({\n  children,\n  variant,\n  ...props\n}, ref) => (\n  <BaseTooltip\n    {...props}\n    className={classNames({ 'tooltip-light': variant === 'light' }, props.className)}\n    ref={ref}\n  >\n    {children}\n  </BaseTooltip>\n));\n\nTooltip.propTypes = {\n  ...BaseTooltip.propTypes,\n  /** An html id attribute, necessary for accessibility. */\n  id: PropTypes.string.isRequired,\n  /**\n   * Sets the direction the `Tooltip` is positioned towards.\n   *\n   * This is generally provided by the `Overlay` component positioning the tooltip.\n   */\n  placement: PropTypes.oneOf(PLACEMENT_VARIANTS),\n  /**\n   * An `Overlay` injected set of props for positioning the `Tooltip` arrow.\n   *\n   * This is generally provided by the `Overlay` component positioning the tooltip.\n   */\n  arrowProps: PropTypes.shape({\n    ref: PropTypes.oneOfType([\n      PropTypes.func,\n      PropTypes.shape({ current: PropTypes.element }),\n    ]),\n    style: PropTypes.shape({}),\n  }),\n  /** Whether the `Overlay` is shown. */\n  show: PropTypes.bool,\n  /** A `Popper.js` config object passed to the the underlying popper instance. */\n  popper: PropTypes.shape({}),\n  /** Overrides underlying component base CSS class name */\n  bsPrefix: PropTypes.string,\n  /** Specifies the content of the `Tooltip` */\n  children: PropTypes.node,\n  /** Specifies class name to append to the base element */\n  className: PropTypes.string,\n  /** The visual style of the `Tooltip` */\n  variant: PropTypes.string,\n};\n\nTooltip.defaultProps = {\n  ...Tooltip.defaultProps,\n  id: undefined,\n  placement: 'right',\n  arrowProps: undefined,\n  show: undefined,\n  popper: undefined,\n  children: undefined,\n  className: undefined,\n  variant: undefined,\n  bsPrefix: 'tooltip',\n};\n\nexport default Tooltip;\n"],"mappings":";;;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,WAAW,MAAM,yBAAyB;AAEjD,IAAMC,kBAAkB,GAAG,CACzB,YAAY,EACZ,MAAM,EACN,UAAU,EACV,WAAW,EACX,KAAK,EACL,SAAS,EACT,aAAa,EACb,OAAO,EACP,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,cAAc,EACd,UAAU,EACV,MAAM,EACN,YAAY,CACb;AAED,IAAMC,OAAO,gBAAGL,KAAK,CAACM,UAAU,CAAC,UAAAC,IAAA,EAI9BC,GAAG;EAAA,IAHJC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,OAAO,GAAAH,IAAA,CAAPG,OAAO;IACJC,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAAA,oBAERb,KAAA,CAAAc,aAAA,CAACX,WAAW,EAAAY,QAAA,KACNJ,KAAK;IACTK,SAAS,EAAEd,UAAU,CAAC;MAAE,eAAe,EAAEQ,OAAO,KAAK;IAAQ,CAAC,EAAEC,KAAK,CAACK,SAAS,CAAE;IACjFR,GAAG,EAAEA;EAAI,IAERC,QACU,CAAC;AAAA,CACf,CAAC;AAEFJ,OAAO,CAACY,SAAS,GAAAC,aAAA,CAAAA,aAAA,KACZf,WAAW,CAACc,SAAS;EACxB;EACAE,EAAE,EAAElB,SAAS,CAACmB,MAAM,CAACC,UAAU;EAC/B;AACF;AACA;AACA;AACA;EACEC,SAAS,EAAErB,SAAS,CAACsB,KAAK,CAACnB,kBAAkB,CAAC;EAC9C;AACF;AACA;AACA;AACA;EACEoB,UAAU,EAAEvB,SAAS,CAACwB,KAAK,CAAC;IAC1BjB,GAAG,EAAEP,SAAS,CAACyB,SAAS,CAAC,CACvBzB,SAAS,CAAC0B,IAAI,EACd1B,SAAS,CAACwB,KAAK,CAAC;MAAEG,OAAO,EAAE3B,SAAS,CAAC4B;IAAQ,CAAC,CAAC,CAChD,CAAC;IACFC,KAAK,EAAE7B,SAAS,CAACwB,KAAK,CAAC,CAAC,CAAC;EAC3B,CAAC,CAAC;EACF;EACAM,IAAI,EAAE9B,SAAS,CAAC+B,IAAI;EACpB;EACAC,MAAM,EAAEhC,SAAS,CAACwB,KAAK,CAAC,CAAC,CAAC,CAAC;EAC3B;EACAS,QAAQ,EAAEjC,SAAS,CAACmB,MAAM;EAC1B;EACAX,QAAQ,EAAER,SAAS,CAACkC,IAAI;EACxB;EACAnB,SAAS,EAAEf,SAAS,CAACmB,MAAM;EAC3B;EACAV,OAAO,EAAET,SAAS,CAACmB;AAAM,EAC1B;AAEDf,OAAO,CAAC+B,YAAY,GAAAlB,aAAA,CAAAA,aAAA,KACfb,OAAO,CAAC+B,YAAY;EACvBjB,EAAE,EAAEkB,SAAS;EACbf,SAAS,EAAE,OAAO;EAClBE,UAAU,EAAEa,SAAS;EACrBN,IAAI,EAAEM,SAAS;EACfJ,MAAM,EAAEI,SAAS;EACjB5B,QAAQ,EAAE4B,SAAS;EACnBrB,SAAS,EAAEqB,SAAS;EACpB3B,OAAO,EAAE2B,SAAS;EAClBH,QAAQ,EAAE;AAAS,EACpB;AAED,eAAe7B,OAAO"}
+{"version":3,"file":"index.js","names":["React","PropTypes","classNames","BaseTooltip","PLACEMENT_VARIANTS","Tooltip","forwardRef","_ref","ref","children","variant","props","_objectWithoutProperties","_excluded","createElement","_extends","className","propTypes","_objectSpread","id","string","isRequired","placement","oneOf","arrowProps","shape","oneOfType","func","current","element","style","show","bool","popper","bsPrefix","node","defaultProps","undefined"],"sources":["../../src/Tooltip/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport BaseTooltip from 'react-bootstrap/Tooltip';\n\nconst PLACEMENT_VARIANTS = [\n  'auto-start',\n  'auto',\n  'auto-end',\n  'top-start',\n  'top',\n  'top-end',\n  'right-start',\n  'right',\n  'right-end',\n  'bottom-end',\n  'bottom',\n  'bottom-start',\n  'left-end',\n  'left',\n  'left-start',\n];\n\nconst Tooltip = React.forwardRef(({\n  children,\n  variant,\n  ...props\n}, ref) => (\n  <BaseTooltip\n    {...props}\n    className={classNames({ 'tooltip-light': variant === 'light' }, props.className)}\n    ref={ref}\n  >\n    {children}\n  </BaseTooltip>\n));\n\nTooltip.propTypes = {\n  ...BaseTooltip.propTypes,\n  /** An html id attribute, necessary for accessibility. */\n  id: PropTypes.string.isRequired,\n  /**\n   * Sets the direction the `Tooltip` is positioned towards.\n   *\n   * This is generally provided by the `Overlay` component positioning the tooltip.\n   */\n  placement: PropTypes.oneOf(PLACEMENT_VARIANTS),\n  /**\n   * An `Overlay` injected set of props for positioning the `Tooltip` arrow.\n   *\n   * This is generally provided by the `Overlay` component positioning the tooltip.\n   */\n  arrowProps: PropTypes.shape({\n    ref: PropTypes.oneOfType([\n      PropTypes.func,\n      PropTypes.shape({ current: PropTypes.element }),\n    ]),\n    style: PropTypes.shape({}),\n  }),\n  /** Whether the `Overlay` is shown. */\n  show: PropTypes.bool,\n  /** A `Popper.js` config object passed to the the underlying popper instance. */\n  popper: PropTypes.shape({}),\n  /** Overrides underlying component base CSS class name */\n  bsPrefix: PropTypes.string,\n  /** Specifies the content of the `Tooltip` */\n  children: PropTypes.node,\n  /** Specifies class name to append to the base element */\n  className: PropTypes.string,\n  /** The visual style of the `Tooltip` */\n  variant: PropTypes.string,\n};\n\nTooltip.defaultProps = {\n  ...Tooltip.defaultProps,\n  id: undefined,\n  placement: 'right',\n  arrowProps: undefined,\n  show: undefined,\n  popper: undefined,\n  children: undefined,\n  className: undefined,\n  variant: undefined,\n  bsPrefix: 'tooltip',\n};\n\nexport default Tooltip;\n"],"mappings":";;;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,WAAW,MAAM,yBAAyB;AAEjD,IAAMC,kBAAkB,GAAG,CACzB,YAAY,EACZ,MAAM,EACN,UAAU,EACV,WAAW,EACX,KAAK,EACL,SAAS,EACT,aAAa,EACb,OAAO,EACP,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,cAAc,EACd,UAAU,EACV,MAAM,EACN,YAAY,CACb;AAED,IAAMC,OAAO,gBAAGL,KAAK,CAACM,UAAU,CAAC,UAAAC,IAAA,EAI9BC,GAAG;EAAA,IAHJC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,OAAO,GAAAH,IAAA,CAAPG,OAAO;IACJC,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAAA,oBAERb,KAAA,CAAAc,aAAA,CAACX,WAAW,EAAAY,QAAA,KACNJ,KAAK;IACTK,SAAS,EAAEd,UAAU,CAAC;MAAE,eAAe,EAAEQ,OAAO,KAAK;IAAQ,CAAC,EAAEC,KAAK,CAACK,SAAS,CAAE;IACjFR,GAAG,EAAEA;EAAI,IAERC,QACU,CAAC;AAAA,CACf,CAAC;AAEFJ,OAAO,CAACY,SAAS,GAAAC,aAAA,CAAAA,aAAA,KACZf,WAAW,CAACc,SAAS;EACxB;EACAE,EAAE,EAAElB,SAAS,CAACmB,MAAM,CAACC,UAAU;EAC/B;AACF;AACA;AACA;AACA;EACEC,SAAS,EAAErB,SAAS,CAACsB,KAAK,CAACnB,kBAAkB,CAAC;EAC9C;AACF;AACA;AACA;AACA;EACEoB,UAAU,EAAEvB,SAAS,CAACwB,KAAK,CAAC;IAC1BjB,GAAG,EAAEP,SAAS,CAACyB,SAAS,CAAC,CACvBzB,SAAS,CAAC0B,IAAI,EACd1B,SAAS,CAACwB,KAAK,CAAC;MAAEG,OAAO,EAAE3B,SAAS,CAAC4B;IAAQ,CAAC,CAAC,CAChD,CAAC;IACFC,KAAK,EAAE7B,SAAS,CAACwB,KAAK,CAAC,CAAC,CAAC;EAC3B,CAAC,CAAC;EACF;EACAM,IAAI,EAAE9B,SAAS,CAAC+B,IAAI;EACpB;EACAC,MAAM,EAAEhC,SAAS,CAACwB,KAAK,CAAC,CAAC,CAAC,CAAC;EAC3B;EACAS,QAAQ,EAAEjC,SAAS,CAACmB,MAAM;EAC1B;EACAX,QAAQ,EAAER,SAAS,CAACkC,IAAI;EACxB;EACAnB,SAAS,EAAEf,SAAS,CAACmB,MAAM;EAC3B;EACAV,OAAO,EAAET,SAAS,CAACmB;AAAM,EAC1B;AAEDf,OAAO,CAAC+B,YAAY,GAAAlB,aAAA,CAAAA,aAAA,KACfb,OAAO,CAAC+B,YAAY;EACvBjB,EAAE,EAAEkB,SAAS;EACbf,SAAS,EAAE,OAAO;EAClBE,UAAU,EAAEa,SAAS;EACrBN,IAAI,EAAEM,SAAS;EACfJ,MAAM,EAAEI,SAAS;EACjB5B,QAAQ,EAAE4B,SAAS;EACnBrB,SAAS,EAAEqB,SAAS;EACpB3B,OAAO,EAAE2B,SAAS;EAClBH,QAAQ,EAAE;AAAS,EACpB;AAED,eAAe7B,OAAO","ignoreList":[]}

package/dist/Tooltip/index.scss

@@ -1,37 +1,163 @@
-@import "variables";
-@import "~bootstrap/scss/tooltip";
-
+// Base class
 .tooltip {
-  filter: $tooltip-box-shadow;
+  position: absolute;
+  z-index: var(--pgn-elevation-tooltip-zindex);
+  display: block;
+  margin: var(--pgn-spacing-tooltip-margin);
+  // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.
+  // So reset our font and text properties to avoid inheriting weird values.
+  @include reset-text();
+  @include font-size(var(--pgn-typography-tooltip-font-size));
+  // Allow breaking very long words so they don't overflow the tooltip's bounds
+  word-wrap: break-word;
+  opacity: 0;
+  filter: var(--pgn-elevation-tooltip-box-shadow);
+
+  &.show {
+    opacity: var(--pgn-other-tooltip-opacity);
+  }
+
+  .arrow {
+    position: absolute;
+    display: block;
+    width: var(--pgn-size-tooltip-arrow-width);
+    height: var(--pgn-size-tooltip-arrow-height);
+
+    &::before {
+      position: absolute;
+      content: "";
+      border-color: transparent;
+      border-style: solid;
+    }
+  }
+}
+
+.bs-tooltip-top {
+  padding: var(--pgn-size-tooltip-arrow-height) 0;
+
+  .arrow {
+    bottom: 0;
+
+    &::before {
+      top: 0;
+      border-width: var(--pgn-size-tooltip-arrow-height) calc(var(--pgn-size-tooltip-arrow-width) * .5) 0;
+      border-top-color: var(--pgn-color-tooltip-arrow-base);
+    }
+  }
+}
+
+.bs-tooltip-right {
+  padding: 0 var(--pgn-size-tooltip-arrow-height);
+
+  .arrow {
+    left: 0;
+    width: var(--pgn-size-tooltip-arrow-height);
+    height: var(--pgn-size-tooltip-arrow-width);
+
+    &::before {
+      right: 0;
+      border-width:
+        calc(var(--pgn-size-tooltip-arrow-width) * .5)
+        var(--pgn-size-tooltip-arrow-height)
+        calc(var(--pgn-size-tooltip-arrow-width) * .5) 0;
+      border-right-color: var(--pgn-color-tooltip-arrow-base);
+    }
+  }
+}
+
+.bs-tooltip-bottom {
+  padding: var(--pgn-size-tooltip-arrow-height) 0;
+
+  .arrow {
+    top: 0;
+
+    &::before {
+      bottom: 0;
+      border-width: 0 calc(var(--pgn-size-tooltip-arrow-width) * .5) var(--pgn-size-tooltip-arrow-height);
+      border-bottom-color: var(--pgn-color-tooltip-arrow-base);
+    }
+  }
+}
+
+.bs-tooltip-left {
+  padding: 0 var(--pgn-size-tooltip-arrow-height);
+
+  .arrow {
+    right: 0;
+    width: var(--pgn-size-tooltip-arrow-height);
+    height: var(--pgn-size-tooltip-arrow-width);
+
+    &::before {
+      left: 0;
+      border-width:
+        calc(var(--pgn-size-tooltip-arrow-width) * .5) 0
+        calc(var(--pgn-size-tooltip-arrow-width) * .5)
+        var(--pgn-size-tooltip-arrow-height);
+      border-left-color: var(--pgn-color-tooltip-arrow-base);
+    }
+  }
+}
+
+.bs-tooltip-auto {
+  &[x-placement^="top"] {
+    // stylelint-disable-next-line scss/at-extend-no-missing-placeholder
+    @extend .bs-tooltip-top;
+  }
+
+  &[x-placement^="right"] {
+    // stylelint-disable-next-line scss/at-extend-no-missing-placeholder
+    @extend .bs-tooltip-right;
+  }
+
+  &[x-placement^="bottom"] {
+    // stylelint-disable-next-line scss/at-extend-no-missing-placeholder
+    @extend .bs-tooltip-bottom;
+  }
+
+  &[x-placement^="left"] {
+    // stylelint-disable-next-line scss/at-extend-no-missing-placeholder
+    @extend .bs-tooltip-left;
+  }
+}
+
+// Wrapper for the tooltip content
+.tooltip-inner {
+  max-width: var(--pgn-size-tooltip-max-width);
+  padding: var(--pgn-spacing-tooltip-padding-y) var(--pgn-spacing-tooltip-padding-x);
+  color: var(--pgn-color-tooltip-text);
+  text-align: center;
+  background-color: var(--pgn-color-tooltip-bg-base);
+
+  @include border-radius(var(--pgn-size-tooltip-border-radius));
 }
 
 .tooltip-light {
   .tooltip-inner {
-    color: $tooltip-color-light;
-    background-color: $tooltip-bg-light;
+    color: var(--pgn-color-tooltip-light);
+    background-color: var(--pgn-color-tooltip-bg-light);
   }
 
   &.bs-tooltip-top .arrow {
     &::before {
-      border-top-color: $tooltip-arrow-color-light;
+      border-top-color: var(--pgn-color-tooltip-arrow-light);
     }
   }
 
   &.bs-tooltip-right .arrow {
     &::before {
-      border-right-color: $tooltip-arrow-color-light;
+      border-right-color: var(--pgn-color-tooltip-arrow-light);
     }
   }
 
   &.bs-tooltip-bottom .arrow {
     &::before {
-      border-bottom-color: $tooltip-arrow-color-light;
+      border-bottom-color: var(--pgn-color-tooltip-arrow-light);
     }
   }
 
   &.bs-tooltip-left .arrow {
     &::before {
-      border-left-color: $tooltip-arrow-color-light;
+      border-left-color: var(--pgn-color-tooltip-arrow-light);
     }
   }
 }

package/dist/TransitionReplace/DemoTransitionReplace.js

@@ -2,7 +2,7 @@ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArra
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useState } from 'react';
 import TransitionReplace from './index';

package/dist/TransitionReplace/DemoTransitionReplace.js.map

@@ -1 +1 @@
-{"version":3,"file":"DemoTransitionReplace.js","names":["React","useState","TransitionReplace","DemoTransitionReplace","contentOptions","createElement","className","key","_useState","_useState2","_slicedToArray","currentContentIndex","setCurrentContentIndex","changeContent","length","onClick","style","background","padding","maxWidth"],"sources":["../../src/TransitionReplace/DemoTransitionReplace.jsx"],"sourcesContent":["import React, { useState } from 'react';\nimport TransitionReplace from './index';\n\nexport default function DemoTransitionReplace() {\n  const contentOptions = [\n    (\n      <blockquote className=\"h2 m-0\" key={0}>\n        <p>You know the golden rule, don’t you boy? Those who have the gold make the rules.</p>\n        <footer>— Crazy hunch-backed old guy in Aladdin</footer>\n      </blockquote>\n    ),\n    (\n      <blockquote className=\"m-0\" key={1}>\n        <p>People say nothing is impossible, but I do nothing every day.</p>\n        <footer>— A. A. Milne</footer>\n      </blockquote>\n    ),\n    (\n      <blockquote className=\"h2 m-0\" key={2}>\n        <p>\n          I won’t go into a big spiel about reincarnation, but the first time I was in the\n          Gucci store in Chicago was the closest I’ve ever felt to home.\n        </p>\n        <footer>— Kanye</footer>\n      </blockquote>\n    ),\n    (\n      <blockquote className=\"m-0\" key={3}>\n        <p>The first time I see a jogger smiling, I’ll consider it.</p>\n        <footer>— Joan Rivers</footer>\n      </blockquote>\n    ),\n  ];\n\n  const [currentContentIndex, setCurrentContentIndex] = useState(0);\n  const changeContent = () => {\n    setCurrentContentIndex((currentContentIndex + 1) % contentOptions.length);\n  };\n\n  return (\n    <div>\n      {/*  eslint-disable-next-line react/button-has-type */}\n      <button className=\"btn btn-primary mb-2\" onClick={changeContent}>Next Quote</button>\n      <div\n        style={{\n          background: '#eee',\n          padding: '1rem',\n          maxWidth: '15rem',\n        }}\n      >\n        <TransitionReplace>\n          {contentOptions[currentContentIndex]}\n        </TransitionReplace>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,OAAOC,iBAAiB,MAAM,SAAS;AAEvC,eAAe,SAASC,qBAAqBA,CAAA,EAAG;EAC9C,IAAMC,cAAc,GAAG,cAEnBJ,KAAA,CAAAK,aAAA;IAAYC,SAAS,EAAC,QAAQ;IAACC,GAAG,EAAE;EAAE,gBACpCP,KAAA,CAAAK,aAAA,YAAG,uFAAmF,CAAC,eACvFL,KAAA,CAAAK,aAAA,iBAAQ,8CAA+C,CAC7C,CAAC,eAGbL,KAAA,CAAAK,aAAA;IAAYC,SAAS,EAAC,KAAK;IAACC,GAAG,EAAE;EAAE,gBACjCP,KAAA,CAAAK,aAAA,YAAG,+DAAgE,CAAC,eACpEL,KAAA,CAAAK,aAAA,iBAAQ,oBAAqB,CACnB,CAAC,eAGbL,KAAA,CAAAK,aAAA;IAAYC,SAAS,EAAC,QAAQ;IAACC,GAAG,EAAE;EAAE,gBACpCP,KAAA,CAAAK,aAAA,YAAG,2JAGA,CAAC,eACJL,KAAA,CAAAK,aAAA,iBAAQ,cAAe,CACb,CAAC,eAGbL,KAAA,CAAAK,aAAA;IAAYC,SAAS,EAAC,KAAK;IAACC,GAAG,EAAE;EAAE,gBACjCP,KAAA,CAAAK,aAAA,YAAG,+DAA2D,CAAC,eAC/DL,KAAA,CAAAK,aAAA,iBAAQ,oBAAqB,CACnB,CAAC,CAEhB;EAED,IAAAG,SAAA,GAAsDP,QAAQ,CAAC,CAAC,CAAC;IAAAQ,UAAA,GAAAC,cAAA,CAAAF,SAAA;IAA1DG,mBAAmB,GAAAF,UAAA;IAAEG,sBAAsB,GAAAH,UAAA;EAClD,IAAMI,aAAa,GAAG,SAAhBA,aAAaA,CAAA,EAAS;IAC1BD,sBAAsB,CAAC,CAACD,mBAAmB,GAAG,CAAC,IAAIP,cAAc,CAACU,MAAM,CAAC;EAC3E,CAAC;EAED,oBACEd,KAAA,CAAAK,aAAA,2BAEEL,KAAA,CAAAK,aAAA;IAAQC,SAAS,EAAC,sBAAsB;IAACS,OAAO,EAAEF;EAAc,GAAC,YAAkB,CAAC,eACpFb,KAAA,CAAAK,aAAA;IACEW,KAAK,EAAE;MACLC,UAAU,EAAE,MAAM;MAClBC,OAAO,EAAE,MAAM;MACfC,QAAQ,EAAE;IACZ;EAAE,gBAEFnB,KAAA,CAAAK,aAAA,CAACH,iBAAiB,QACfE,cAAc,CAACO,mBAAmB,CAClB,CAChB,CACF,CAAC;AAEV"}
+{"version":3,"file":"DemoTransitionReplace.js","names":["React","useState","TransitionReplace","DemoTransitionReplace","contentOptions","createElement","className","key","_useState","_useState2","_slicedToArray","currentContentIndex","setCurrentContentIndex","changeContent","length","onClick","style","background","padding","maxWidth"],"sources":["../../src/TransitionReplace/DemoTransitionReplace.jsx"],"sourcesContent":["import React, { useState } from 'react';\nimport TransitionReplace from './index';\n\nexport default function DemoTransitionReplace() {\n  const contentOptions = [\n    (\n      <blockquote className=\"h2 m-0\" key={0}>\n        <p>You know the golden rule, don’t you boy? Those who have the gold make the rules.</p>\n        <footer>— Crazy hunch-backed old guy in Aladdin</footer>\n      </blockquote>\n    ),\n    (\n      <blockquote className=\"m-0\" key={1}>\n        <p>People say nothing is impossible, but I do nothing every day.</p>\n        <footer>— A. A. Milne</footer>\n      </blockquote>\n    ),\n    (\n      <blockquote className=\"h2 m-0\" key={2}>\n        <p>\n          I won’t go into a big spiel about reincarnation, but the first time I was in the\n          Gucci store in Chicago was the closest I’ve ever felt to home.\n        </p>\n        <footer>— Kanye</footer>\n      </blockquote>\n    ),\n    (\n      <blockquote className=\"m-0\" key={3}>\n        <p>The first time I see a jogger smiling, I’ll consider it.</p>\n        <footer>— Joan Rivers</footer>\n      </blockquote>\n    ),\n  ];\n\n  const [currentContentIndex, setCurrentContentIndex] = useState(0);\n  const changeContent = () => {\n    setCurrentContentIndex((currentContentIndex + 1) % contentOptions.length);\n  };\n\n  return (\n    <div>\n      {/*  eslint-disable-next-line react/button-has-type */}\n      <button className=\"btn btn-primary mb-2\" onClick={changeContent}>Next Quote</button>\n      <div\n        style={{\n          background: '#eee',\n          padding: '1rem',\n          maxWidth: '15rem',\n        }}\n      >\n        <TransitionReplace>\n          {contentOptions[currentContentIndex]}\n        </TransitionReplace>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,OAAOC,iBAAiB,MAAM,SAAS;AAEvC,eAAe,SAASC,qBAAqBA,CAAA,EAAG;EAC9C,IAAMC,cAAc,GAAG,cAEnBJ,KAAA,CAAAK,aAAA;IAAYC,SAAS,EAAC,QAAQ;IAACC,GAAG,EAAE;EAAE,gBACpCP,KAAA,CAAAK,aAAA,YAAG,uFAAmF,CAAC,eACvFL,KAAA,CAAAK,aAAA,iBAAQ,8CAA+C,CAC7C,CAAC,eAGbL,KAAA,CAAAK,aAAA;IAAYC,SAAS,EAAC,KAAK;IAACC,GAAG,EAAE;EAAE,gBACjCP,KAAA,CAAAK,aAAA,YAAG,+DAAgE,CAAC,eACpEL,KAAA,CAAAK,aAAA,iBAAQ,oBAAqB,CACnB,CAAC,eAGbL,KAAA,CAAAK,aAAA;IAAYC,SAAS,EAAC,QAAQ;IAACC,GAAG,EAAE;EAAE,gBACpCP,KAAA,CAAAK,aAAA,YAAG,2JAGA,CAAC,eACJL,KAAA,CAAAK,aAAA,iBAAQ,cAAe,CACb,CAAC,eAGbL,KAAA,CAAAK,aAAA;IAAYC,SAAS,EAAC,KAAK;IAACC,GAAG,EAAE;EAAE,gBACjCP,KAAA,CAAAK,aAAA,YAAG,+DAA2D,CAAC,eAC/DL,KAAA,CAAAK,aAAA,iBAAQ,oBAAqB,CACnB,CAAC,CAEhB;EAED,IAAAG,SAAA,GAAsDP,QAAQ,CAAC,CAAC,CAAC;IAAAQ,UAAA,GAAAC,cAAA,CAAAF,SAAA;IAA1DG,mBAAmB,GAAAF,UAAA;IAAEG,sBAAsB,GAAAH,UAAA;EAClD,IAAMI,aAAa,GAAG,SAAhBA,aAAaA,CAAA,EAAS;IAC1BD,sBAAsB,CAAC,CAACD,mBAAmB,GAAG,CAAC,IAAIP,cAAc,CAACU,MAAM,CAAC;EAC3E,CAAC;EAED,oBACEd,KAAA,CAAAK,aAAA,2BAEEL,KAAA,CAAAK,aAAA;IAAQC,SAAS,EAAC,sBAAsB;IAACS,OAAO,EAAEF;EAAc,GAAC,YAAkB,CAAC,eACpFb,KAAA,CAAAK,aAAA;IACEW,KAAK,EAAE;MACLC,UAAU,EAAE,MAAM;MAClBC,OAAO,EAAE,MAAM;MACfC,QAAQ,EAAE;IACZ;EAAE,gBAEFnB,KAAA,CAAAK,aAAA,CAACH,iBAAiB,QACfE,cAAc,CAACO,mBAAmB,CAClB,CAChB,CACF,CAAC;AAEV","ignoreList":[]}