@sendoutcards/quantum-design-ui 1.8.0 → 1.8.2

package/dist/index.es.js

@@ -506,7 +506,7 @@ var text$9 = {
     extraBold: concepts$9.typography.weights.extraBold
   }
 };
-var mediaQueries$c = {
+var mediaQueries$d = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -921,7 +921,7 @@ var colorOption$9 = {
   }
 };
 var entities$9 = {
-  mediaQueries: mediaQueries$c,
+  mediaQueries: mediaQueries$d,
   hocs: hocs$9,
   text: text$9,
   spacing: spacing$9,
@@ -1261,7 +1261,7 @@ var text$8 = {
     extraBold: concepts$8.typography.weights.extraBold
   }
 };
-var mediaQueries$b = {
+var mediaQueries$c = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -1677,7 +1677,7 @@ var colorOption$8 = {
   }
 };
 var entities$8 = {
-  mediaQueries: mediaQueries$b,
+  mediaQueries: mediaQueries$c,
   hocs: hocs$8,
   text: text$8,
   spacing: spacing$8,
@@ -1976,7 +1976,7 @@ var text$7 = {
     extraBold: concepts$7.typography.weights.extraBold
   }
 };
-var mediaQueries$a = {
+var mediaQueries$b = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -2392,7 +2392,7 @@ var colorOption$7 = {
   }
 };
 var entities$7 = {
-  mediaQueries: mediaQueries$a,
+  mediaQueries: mediaQueries$b,
   hocs: hocs$7,
   text: text$7,
   spacing: spacing$7,
@@ -2691,7 +2691,7 @@ var text$6 = {
     extraBold: concepts$6.typography.weights.extraBold
   }
 };
-var mediaQueries$9 = {
+var mediaQueries$a = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -3107,7 +3107,7 @@ var colorOption$6 = {
   }
 };
 var entities$6 = {
-  mediaQueries: mediaQueries$9,
+  mediaQueries: mediaQueries$a,
   hocs: hocs$6,
   text: text$6,
   spacing: spacing$6,
@@ -3408,7 +3408,7 @@ var text$5 = {
     extraBold: concepts$5.typography.weights.extraBold
   }
 };
-var mediaQueries$8 = {
+var mediaQueries$9 = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -3824,7 +3824,7 @@ var colorOption$5 = {
   }
 };
 var entities$5 = {
-  mediaQueries: mediaQueries$8,
+  mediaQueries: mediaQueries$9,
   hocs: hocs$5,
   text: text$5,
   spacing: spacing$5,
@@ -4125,7 +4125,7 @@ var text$4 = {
     extraBold: concepts$4.typography.weights.extraBold
   }
 };
-var mediaQueries$7 = {
+var mediaQueries$8 = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -4541,7 +4541,7 @@ var colorOption$4 = {
   }
 };
 var entities$4 = {
-  mediaQueries: mediaQueries$7,
+  mediaQueries: mediaQueries$8,
   hocs: hocs$4,
   text: text$4,
   spacing: spacing$4,
@@ -4842,7 +4842,7 @@ var text$3 = {
     extraBold: concepts$3.typography.weights.extraBold
   }
 };
-var mediaQueries$6 = {
+var mediaQueries$7 = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -5258,7 +5258,7 @@ var colorOption$3 = {
   }
 };
 var entities$3 = {
-  mediaQueries: mediaQueries$6,
+  mediaQueries: mediaQueries$7,
   hocs: hocs$3,
   text: text$3,
   spacing: spacing$3,
@@ -5559,7 +5559,7 @@ var text$2 = {
     extraBold: concepts$2.typography.weights.extraBold
   }
 };
-var mediaQueries$5 = {
+var mediaQueries$6 = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -5975,7 +5975,7 @@ var colorOption$2 = {
   }
 };
 var entities$2 = {
-  mediaQueries: mediaQueries$5,
+  mediaQueries: mediaQueries$6,
   hocs: hocs$2,
   text: text$2,
   spacing: spacing$2,
@@ -6272,7 +6272,7 @@ var text$1 = {
     extraBold: concepts$1.typography.weights.extraBold
   }
 };
-var mediaQueries$4 = {
+var mediaQueries$5 = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -6688,7 +6688,7 @@ var colorOption$1 = {
   }
 };
 var entities$1 = {
-  mediaQueries: mediaQueries$4,
+  mediaQueries: mediaQueries$5,
   hocs: hocs$1,
   text: text$1,
   spacing: spacing$1,
@@ -6986,7 +6986,7 @@ var text = {
     extraBold: concepts.typography.weights.extraBold
   }
 };
-var mediaQueries$3 = {
+var mediaQueries$4 = {
   queries: {
     xSmall: "@media screen and (min-width: 0px)",
     // Large Mobile
@@ -7402,7 +7402,7 @@ var colorOption = {
   }
 };
 var entities = {
-  mediaQueries: mediaQueries$3,
+  mediaQueries: mediaQueries$4,
   hocs: hocs,
   text: text,
   spacing: spacing,
@@ -11983,7 +11983,7 @@ var styles$T = {
 };
 var templateObject_1$X, templateObject_2$w, templateObject_3$j;
 
-var mediaQueries$2 = entities$9.mediaQueries;
+var mediaQueries$3 = entities$9.mediaQueries;
 var makeResponsive = function (property, value, entity) {
   var style = {};
   if (typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean') {
@@ -11994,7 +11994,7 @@ var makeResponsive = function (property, value, entity) {
       if (key === 'xSmall') {
         style[property] = entity && entity["" + value[key]] || "" + value[key];
       } else {
-        style[mediaQueries$2.queries[key]] = (_a = {}, _a[property] = entity && entity["" + value[key]] || "" + value[key], _a);
+        style[mediaQueries$3.queries[key]] = (_a = {}, _a[property] = entity && entity["" + value[key]] || "" + value[key], _a);
       }
     });
   }
@@ -12362,26 +12362,26 @@ var useWindowSize = function () {
   };
 };
 
-var mediaQueries$1 = entities$9.mediaQueries;
+var mediaQueries$2 = entities$9.mediaQueries;
 var makeTextResponsive = function (size, callback, windowSize) {
   // TODO - Change this function to allow cases to fall through, as of now you have to specify every media query size
   var lastQuery = 'body';
   if (isTextType(size)) {
     return callback(size);
   } else {
-    if (size.xSmall && windowSize >= mediaQueries$1.rawValues.xSmall) {
+    if (size.xSmall && windowSize >= mediaQueries$2.rawValues.xSmall) {
       lastQuery = size.xSmall;
     }
-    if (size.small && windowSize >= mediaQueries$1.rawValues.small) {
+    if (size.small && windowSize >= mediaQueries$2.rawValues.small) {
       lastQuery = size.small;
     }
-    if (size.medium && windowSize >= mediaQueries$1.rawValues.medium) {
+    if (size.medium && windowSize >= mediaQueries$2.rawValues.medium) {
       lastQuery = size.medium;
     }
-    if (size.large && windowSize >= mediaQueries$1.rawValues.large) {
+    if (size.large && windowSize >= mediaQueries$2.rawValues.large) {
       lastQuery = size.large;
     }
-    if (size.xLarge && windowSize >= mediaQueries$1.rawValues.xLarge) {
+    if (size.xLarge && windowSize >= mediaQueries$2.rawValues.xLarge) {
       lastQuery = size.xLarge;
     }
   }
@@ -13874,13 +13874,13 @@ var _emotionSourceMap4$8 = process.env.NODE_ENV === "production" ? "" : "/*# sou
 var _emotionSourceMap3$f = process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFhYSIsImZpbGUiOiJzdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBfX21ha2VUZW1wbGF0ZU9iamVjdCB9IGZyb20gXCJ0c2xpYlwiO1xyXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jb3JlJztcclxuaW1wb3J0IHsgZW50aXRpZXMgfSBmcm9tIFwiLi4vLi4vdGhlbWUvdGhlbWluZy9lbnRpdGllc1wiO1xyXG52YXIgbWVkaWFRdWVyaWVzID0gZW50aXRpZXMubWVkaWFRdWVyaWVzO1xyXG5leHBvcnQgZGVmYXVsdCB7XHJcbiAgICBzaGVldFdyYXBwZXI6IGZ1bmN0aW9uIChtb2JpbGUsIGxheWVyKSB7IHJldHVybiBjc3ModGVtcGxhdGVPYmplY3RfMSB8fCAodGVtcGxhdGVPYmplY3RfMSA9IF9fbWFrZVRlbXBsYXRlT2JqZWN0KFtcIlxcbiAgICBwb3NpdGlvbjogXCIsIFwiO1xcbiAgICBib3R0b206IDA7XFxuICAgIGxlZnQ6IDA7XFxuICAgIHotaW5kZXg6IFwiLCBcIjtcXG4gIFwiXSwgW1wiXFxuICAgIHBvc2l0aW9uOiBcIiwgXCI7XFxuICAgIGJvdHRvbTogMDtcXG4gICAgbGVmdDogMDtcXG4gICAgei1pbmRleDogXCIsIFwiO1xcbiAgXCJdKSksIG1vYmlsZSA/ICdhYnNvbHV0ZScgOiAncmVsYXRpdmUnLCBsYXllcik7IH0sXHJcbiAgICBzaGVldDogZnVuY3Rpb24gKHNoZWV0RW50aXR5LCBoYXNCYWNrZ3JvdW5kRWxlbWVudCwgaXNNb2JpbGUsIGJhY2tncm91bmRDb2xvcikgeyByZXR1cm4gY3NzKHRlbXBsYXRlT2JqZWN0XzIgfHwgKHRlbXBsYXRlT2JqZWN0XzIgPSBfX21ha2VUZW1wbGF0ZU9iamVjdChbXCJcXG4gICAgd2lkdGg6IDEwMCU7XFxuICAgIGRpc3BsYXk6IGZsZXg7XFxuICAgIGJhY2tncm91bmQtY29sb3I6IFwiLCBcIjtcXG4gICAgcGxhY2UtaXRlbXM6IHN0YXJ0IGNlbnRlcjtcXG4gICAgcGxhY2UtY29udGVudDogc3RhcnQgY2VudGVyO1xcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xcbiAgICBib3JkZXItcmFkaXVzOiBcIiwgXCI7XFxuICAgIGJveC1zaGFkb3c6IFwiLCBcIjtcXG4gICAgcGFkZGluZzogNDhweCAzMnB4IDMycHggMzJweDtcXG4gICAgcG9zaXRpb246IFwiLCBcIjtcXG4gICAgYm90dG9tOiBcIiwgXCI7XFxuICAgIHotaW5kZXg6IDM7XFxuICAgIG9yZGVyOiAyO1xcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiBcIiwgXCIpIHtcXG4gICAgICBib3JkZXItcmFkaXVzOiBcIiwgXCI7XFxuICAgIH1cXG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogXCIsIFwiKSB7XFxuICAgICAgd2lkdGg6IFwiLCBcIjtcXG4gICAgICBvcmRlcjogMTtcXG4gICAgICBib3JkZXItcmFkaXVzOiBcIiwgXCI7XFxuICAgIH1cXG4gIFwiXSwgW1wiXFxuICAgIHdpZHRoOiAxMDAlO1xcbiAgICBkaXNwbGF5OiBmbGV4O1xcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBcIiwgXCI7XFxuICAgIHBsYWNlLWl0ZW1zOiBzdGFydCBjZW50ZXI7XFxuICAgIHBsYWNlLWNvbnRlbnQ6IHN0YXJ0IGNlbnRlcjtcXG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcXG4gICAgYm9yZGVyLXJhZGl1czogXCIsIFwiO1xcbiAgICBib3gtc2hhZG93OiBcIiwgXCI7XFxuICAgIHBhZGRpbmc6IDQ4cHggMzJweCAzMnB4IDMycHg7XFxuICAgIHBvc2l0aW9uOiBcIiwgXCI7XFxuICAgIGJvdHRvbTogXCIsIFwiO1xcbiAgICB6LWluZGV4OiAzO1xcbiAgICBvcmRlcjogMjtcXG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogXCIsIFwiKSB7XFxuICAgICAgYm9yZGVyLXJhZGl1czogXCIsXHJcbiAgICAgICAgXCI7XFxuICAgIH1cXG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogXCIsIFwiKSB7XFxuICAgICAgd2lkdGg6IFwiLCBcIjtcXG4gICAgICBvcmRlcjogMTtcXG4gICAgICBib3JkZXItcmFkaXVzOiBcIixcclxuICAgICAgICBcIjtcXG4gICAgfVxcbiAgXCJdKSksIGJhY2tncm91bmRDb2xvciB8fCAnd2hpdGUnLCBzaGVldEVudGl0eS5tb2JpbGVCb3JkZXJSYWRpdXMgKyBcIiBcIiArIHNoZWV0RW50aXR5Lm1vYmlsZUJvcmRlclJhZGl1cyArIFwiIDAgMFwiLCBzaGVldEVudGl0eS5ib3hTaGFkb3csIGlzTW9iaWxlID8gJ2Fic29sdXRlJyA6ICdyZWxhdGl2ZScsIGlzTW9iaWxlICYmIDAsIG1lZGlhUXVlcmllcy5yYXdWYWx1ZXMuc21hbGwgKyBcInB4XCIsIGhhc0JhY2tncm91bmRFbGVtZW50XHJcbiAgICAgICAgPyBzaGVldEVudGl0eS5kZXNrdG9wQm9yZGVyUmFkaXVzICsgXCIgXCIgKyBzaGVldEVudGl0eS5kZXNrdG9wQm9yZGVyUmFkaXVzICsgXCIgMCAwIFwiXHJcbiAgICAgICAgOiBcIlwiICsgc2hlZXRFbnRpdHkuZGVza3RvcEJvcmRlclJhZGl1cywgbWVkaWFRdWVyaWVzLnJhd1ZhbHVlcy5tZWRpdW0gKyBcInB4XCIsIGhhc0JhY2tncm91bmRFbGVtZW50ID8gJzUwJScgOiAnMTAwJScsIGhhc0JhY2tncm91bmRFbGVtZW50XHJcbiAgICAgICAgPyBzaGVldEVudGl0eS5kZXNrdG9wQm9yZGVyUmFkaXVzICsgXCIgMCAwIFwiICsgc2hlZXRFbnRpdHkuZGVza3RvcEJvcmRlclJhZGl1c1xyXG4gICAgICAgIDogXCJcIiArIHNoZWV0RW50aXR5LmRlc2t0b3BCb3JkZXJSYWRpdXMpOyB9LFxyXG4gICAgZHJhZ0JhcjogY3NzKHRlbXBsYXRlT2JqZWN0XzMgfHwgKHRlbXBsYXRlT2JqZWN0XzMgPSBfX21ha2VUZW1wbGF0ZU9iamVjdChbXCJcXG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC01MCUpO1xcbiAgXCJdLCBbXCJcXG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC01MCUpO1xcbiAgXCJdKSkpLFxyXG4gICAgY2hpbGRXcmFwcGVyOiBjc3ModGVtcGxhdGVPYmplY3RfNCB8fCAodGVtcGxhdGVPYmplY3RfNCA9IF9fbWFrZVRlbXBsYXRlT2JqZWN0KFtcIlxcbiAgICA6Oi13ZWJraXQtc2Nyb2xsYmFyIHtcXG4gICAgICB3aWR0aDogMHB4O1xcbiAgICAgIGJhY2tncm91bmQ6IHRyYW5zcGFyZW50OyAvKiBtYWtlIHNjcm9sbGJhciB0cmFuc3BhcmVudCAqL1xcbiAgICB9XFxuICBcIl0sIFtcIlxcbiAgICA6Oi13ZWJraXQtc2Nyb2xsYmFyIHtcXG4gICAgICB3aWR0aDogMHB4O1xcbiAgICAgIGJhY2tncm91bmQ6IHRyYW5zcGFyZW50OyAvKiBtYWtlIHNjcm9sbGJhciB0cmFuc3BhcmVudCAqL1xcbiAgICB9XFxuICBcIl0pKSksXHJcbn07XHJcbnZhciB0ZW1wbGF0ZU9iamVjdF8xLCB0ZW1wbGF0ZU9iamVjdF8yLCB0ZW1wbGF0ZU9iamVjdF8zLCB0ZW1wbGF0ZU9iamVjdF80O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1zdHlsZXMuanMubWFwIl19 */";
 var _emotionSourceMap2$n = process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNNEYiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgX19tYWtlVGVtcGxhdGVPYmplY3QgfSBmcm9tIFwidHNsaWJcIjtcclxuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XHJcbmltcG9ydCB7IGVudGl0aWVzIH0gZnJvbSBcIi4uLy4uL3RoZW1lL3RoZW1pbmcvZW50aXRpZXNcIjtcclxudmFyIG1lZGlhUXVlcmllcyA9IGVudGl0aWVzLm1lZGlhUXVlcmllcztcclxuZXhwb3J0IGRlZmF1bHQge1xyXG4gICAgc2hlZXRXcmFwcGVyOiBmdW5jdGlvbiAobW9iaWxlLCBsYXllcikgeyByZXR1cm4gY3NzKHRlbXBsYXRlT2JqZWN0XzEgfHwgKHRlbXBsYXRlT2JqZWN0XzEgPSBfX21ha2VUZW1wbGF0ZU9iamVjdChbXCJcXG4gICAgcG9zaXRpb246IFwiLCBcIjtcXG4gICAgYm90dG9tOiAwO1xcbiAgICBsZWZ0OiAwO1xcbiAgICB6LWluZGV4OiBcIiwgXCI7XFxuICBcIl0sIFtcIlxcbiAgICBwb3NpdGlvbjogXCIsIFwiO1xcbiAgICBib3R0b206IDA7XFxuICAgIGxlZnQ6IDA7XFxuICAgIHotaW5kZXg6IFwiLCBcIjtcXG4gIFwiXSkpLCBtb2JpbGUgPyAnYWJzb2x1dGUnIDogJ3JlbGF0aXZlJywgbGF5ZXIpOyB9LFxyXG4gICAgc2hlZXQ6IGZ1bmN0aW9uIChzaGVldEVudGl0eSwgaGFzQmFja2dyb3VuZEVsZW1lbnQsIGlzTW9iaWxlLCBiYWNrZ3JvdW5kQ29sb3IpIHsgcmV0dXJuIGNzcyh0ZW1wbGF0ZU9iamVjdF8yIHx8ICh0ZW1wbGF0ZU9iamVjdF8yID0gX19tYWtlVGVtcGxhdGVPYmplY3QoW1wiXFxuICAgIHdpZHRoOiAxMDAlO1xcbiAgICBkaXNwbGF5OiBmbGV4O1xcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBcIiwgXCI7XFxuICAgIHBsYWNlLWl0ZW1zOiBzdGFydCBjZW50ZXI7XFxuICAgIHBsYWNlLWNvbnRlbnQ6IHN0YXJ0IGNlbnRlcjtcXG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcXG4gICAgYm9yZGVyLXJhZGl1czogXCIsIFwiO1xcbiAgICBib3gtc2hhZG93OiBcIiwgXCI7XFxuICAgIHBhZGRpbmc6IDQ4cHggMzJweCAzMnB4IDMycHg7XFxuICAgIHBvc2l0aW9uOiBcIiwgXCI7XFxuICAgIGJvdHRvbTogXCIsIFwiO1xcbiAgICB6LWluZGV4OiAzO1xcbiAgICBvcmRlcjogMjtcXG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogXCIsIFwiKSB7XFxuICAgICAgYm9yZGVyLXJhZGl1czogXCIsIFwiO1xcbiAgICB9XFxuICAgIEBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IFwiLCBcIikge1xcbiAgICAgIHdpZHRoOiBcIiwgXCI7XFxuICAgICAgb3JkZXI6IDE7XFxuICAgICAgYm9yZGVyLXJhZGl1czogXCIsIFwiO1xcbiAgICB9XFxuICBcIl0sIFtcIlxcbiAgICB3aWR0aDogMTAwJTtcXG4gICAgZGlzcGxheTogZmxleDtcXG4gICAgYmFja2dyb3VuZC1jb2xvcjogXCIsIFwiO1xcbiAgICBwbGFjZS1pdGVtczogc3RhcnQgY2VudGVyO1xcbiAgICBwbGFjZS1jb250ZW50OiBzdGFydCBjZW50ZXI7XFxuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XFxuICAgIGJvcmRlci1yYWRpdXM6IFwiLCBcIjtcXG4gICAgYm94LXNoYWRvdzogXCIsIFwiO1xcbiAgICBwYWRkaW5nOiA0OHB4IDMycHggMzJweCAzMnB4O1xcbiAgICBwb3NpdGlvbjogXCIsIFwiO1xcbiAgICBib3R0b206IFwiLCBcIjtcXG4gICAgei1pbmRleDogMztcXG4gICAgb3JkZXI6IDI7XFxuICAgIEBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IFwiLCBcIikge1xcbiAgICAgIGJvcmRlci1yYWRpdXM6IFwiLFxyXG4gICAgICAgIFwiO1xcbiAgICB9XFxuICAgIEBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IFwiLCBcIikge1xcbiAgICAgIHdpZHRoOiBcIiwgXCI7XFxuICAgICAgb3JkZXI6IDE7XFxuICAgICAgYm9yZGVyLXJhZGl1czogXCIsXHJcbiAgICAgICAgXCI7XFxuICAgIH1cXG4gIFwiXSkpLCBiYWNrZ3JvdW5kQ29sb3IgfHwgJ3doaXRlJywgc2hlZXRFbnRpdHkubW9iaWxlQm9yZGVyUmFkaXVzICsgXCIgXCIgKyBzaGVldEVudGl0eS5tb2JpbGVCb3JkZXJSYWRpdXMgKyBcIiAwIDBcIiwgc2hlZXRFbnRpdHkuYm94U2hhZG93LCBpc01vYmlsZSA/ICdhYnNvbHV0ZScgOiAncmVsYXRpdmUnLCBpc01vYmlsZSAmJiAwLCBtZWRpYVF1ZXJpZXMucmF3VmFsdWVzLnNtYWxsICsgXCJweFwiLCBoYXNCYWNrZ3JvdW5kRWxlbWVudFxyXG4gICAgICAgID8gc2hlZXRFbnRpdHkuZGVza3RvcEJvcmRlclJhZGl1cyArIFwiIFwiICsgc2hlZXRFbnRpdHkuZGVza3RvcEJvcmRlclJhZGl1cyArIFwiIDAgMCBcIlxyXG4gICAgICAgIDogXCJcIiArIHNoZWV0RW50aXR5LmRlc2t0b3BCb3JkZXJSYWRpdXMsIG1lZGlhUXVlcmllcy5yYXdWYWx1ZXMubWVkaXVtICsgXCJweFwiLCBoYXNCYWNrZ3JvdW5kRWxlbWVudCA/ICc1MCUnIDogJzEwMCUnLCBoYXNCYWNrZ3JvdW5kRWxlbWVudFxyXG4gICAgICAgID8gc2hlZXRFbnRpdHkuZGVza3RvcEJvcmRlclJhZGl1cyArIFwiIDAgMCBcIiArIHNoZWV0RW50aXR5LmRlc2t0b3BCb3JkZXJSYWRpdXNcclxuICAgICAgICA6IFwiXCIgKyBzaGVldEVudGl0eS5kZXNrdG9wQm9yZGVyUmFkaXVzKTsgfSxcclxuICAgIGRyYWdCYXI6IGNzcyh0ZW1wbGF0ZU9iamVjdF8zIHx8ICh0ZW1wbGF0ZU9iamVjdF8zID0gX19tYWtlVGVtcGxhdGVPYmplY3QoW1wiXFxuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKTtcXG4gIFwiXSwgW1wiXFxuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKTtcXG4gIFwiXSkpKSxcclxuICAgIGNoaWxkV3JhcHBlcjogY3NzKHRlbXBsYXRlT2JqZWN0XzQgfHwgKHRlbXBsYXRlT2JqZWN0XzQgPSBfX21ha2VUZW1wbGF0ZU9iamVjdChbXCJcXG4gICAgOjotd2Via2l0LXNjcm9sbGJhciB7XFxuICAgICAgd2lkdGg6IDBweDtcXG4gICAgICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDsgLyogbWFrZSBzY3JvbGxiYXIgdHJhbnNwYXJlbnQgKi9cXG4gICAgfVxcbiAgXCJdLCBbXCJcXG4gICAgOjotd2Via2l0LXNjcm9sbGJhciB7XFxuICAgICAgd2lkdGg6IDBweDtcXG4gICAgICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDsgLyogbWFrZSBzY3JvbGxiYXIgdHJhbnNwYXJlbnQgKi9cXG4gICAgfVxcbiAgXCJdKSkpLFxyXG59O1xyXG52YXIgdGVtcGxhdGVPYmplY3RfMSwgdGVtcGxhdGVPYmplY3RfMiwgdGVtcGxhdGVPYmplY3RfMywgdGVtcGxhdGVPYmplY3RfNDtcclxuLy8jIHNvdXJjZU1hcHBpbmdVUkw9c3R5bGVzLmpzLm1hcCJdfQ== */";
 var _emotionSourceMap$C = process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLb0QiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgX19tYWtlVGVtcGxhdGVPYmplY3QgfSBmcm9tIFwidHNsaWJcIjtcclxuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XHJcbmltcG9ydCB7IGVudGl0aWVzIH0gZnJvbSBcIi4uLy4uL3RoZW1lL3RoZW1pbmcvZW50aXRpZXNcIjtcclxudmFyIG1lZGlhUXVlcmllcyA9IGVudGl0aWVzLm1lZGlhUXVlcmllcztcclxuZXhwb3J0IGRlZmF1bHQge1xyXG4gICAgc2hlZXRXcmFwcGVyOiBmdW5jdGlvbiAobW9iaWxlLCBsYXllcikgeyByZXR1cm4gY3NzKHRlbXBsYXRlT2JqZWN0XzEgfHwgKHRlbXBsYXRlT2JqZWN0XzEgPSBfX21ha2VUZW1wbGF0ZU9iamVjdChbXCJcXG4gICAgcG9zaXRpb246IFwiLCBcIjtcXG4gICAgYm90dG9tOiAwO1xcbiAgICBsZWZ0OiAwO1xcbiAgICB6LWluZGV4OiBcIiwgXCI7XFxuICBcIl0sIFtcIlxcbiAgICBwb3NpdGlvbjogXCIsIFwiO1xcbiAgICBib3R0b206IDA7XFxuICAgIGxlZnQ6IDA7XFxuICAgIHotaW5kZXg6IFwiLCBcIjtcXG4gIFwiXSkpLCBtb2JpbGUgPyAnYWJzb2x1dGUnIDogJ3JlbGF0aXZlJywgbGF5ZXIpOyB9LFxyXG4gICAgc2hlZXQ6IGZ1bmN0aW9uIChzaGVldEVudGl0eSwgaGFzQmFja2dyb3VuZEVsZW1lbnQsIGlzTW9iaWxlLCBiYWNrZ3JvdW5kQ29sb3IpIHsgcmV0dXJuIGNzcyh0ZW1wbGF0ZU9iamVjdF8yIHx8ICh0ZW1wbGF0ZU9iamVjdF8yID0gX19tYWtlVGVtcGxhdGVPYmplY3QoW1wiXFxuICAgIHdpZHRoOiAxMDAlO1xcbiAgICBkaXNwbGF5OiBmbGV4O1xcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBcIiwgXCI7XFxuICAgIHBsYWNlLWl0ZW1zOiBzdGFydCBjZW50ZXI7XFxuICAgIHBsYWNlLWNvbnRlbnQ6IHN0YXJ0IGNlbnRlcjtcXG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcXG4gICAgYm9yZGVyLXJhZGl1czogXCIsIFwiO1xcbiAgICBib3gtc2hhZG93OiBcIiwgXCI7XFxuICAgIHBhZGRpbmc6IDQ4cHggMzJweCAzMnB4IDMycHg7XFxuICAgIHBvc2l0aW9uOiBcIiwgXCI7XFxuICAgIGJvdHRvbTogXCIsIFwiO1xcbiAgICB6LWluZGV4OiAzO1xcbiAgICBvcmRlcjogMjtcXG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogXCIsIFwiKSB7XFxuICAgICAgYm9yZGVyLXJhZGl1czogXCIsIFwiO1xcbiAgICB9XFxuICAgIEBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IFwiLCBcIikge1xcbiAgICAgIHdpZHRoOiBcIiwgXCI7XFxuICAgICAgb3JkZXI6IDE7XFxuICAgICAgYm9yZGVyLXJhZGl1czogXCIsIFwiO1xcbiAgICB9XFxuICBcIl0sIFtcIlxcbiAgICB3aWR0aDogMTAwJTtcXG4gICAgZGlzcGxheTogZmxleDtcXG4gICAgYmFja2dyb3VuZC1jb2xvcjogXCIsIFwiO1xcbiAgICBwbGFjZS1pdGVtczogc3RhcnQgY2VudGVyO1xcbiAgICBwbGFjZS1jb250ZW50OiBzdGFydCBjZW50ZXI7XFxuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XFxuICAgIGJvcmRlci1yYWRpdXM6IFwiLCBcIjtcXG4gICAgYm94LXNoYWRvdzogXCIsIFwiO1xcbiAgICBwYWRkaW5nOiA0OHB4IDMycHggMzJweCAzMnB4O1xcbiAgICBwb3NpdGlvbjogXCIsIFwiO1xcbiAgICBib3R0b206IFwiLCBcIjtcXG4gICAgei1pbmRleDogMztcXG4gICAgb3JkZXI6IDI7XFxuICAgIEBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IFwiLCBcIikge1xcbiAgICAgIGJvcmRlci1yYWRpdXM6IFwiLFxyXG4gICAgICAgIFwiO1xcbiAgICB9XFxuICAgIEBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IFwiLCBcIikge1xcbiAgICAgIHdpZHRoOiBcIiwgXCI7XFxuICAgICAgb3JkZXI6IDE7XFxuICAgICAgYm9yZGVyLXJhZGl1czogXCIsXHJcbiAgICAgICAgXCI7XFxuICAgIH1cXG4gIFwiXSkpLCBiYWNrZ3JvdW5kQ29sb3IgfHwgJ3doaXRlJywgc2hlZXRFbnRpdHkubW9iaWxlQm9yZGVyUmFkaXVzICsgXCIgXCIgKyBzaGVldEVudGl0eS5tb2JpbGVCb3JkZXJSYWRpdXMgKyBcIiAwIDBcIiwgc2hlZXRFbnRpdHkuYm94U2hhZG93LCBpc01vYmlsZSA/ICdhYnNvbHV0ZScgOiAncmVsYXRpdmUnLCBpc01vYmlsZSAmJiAwLCBtZWRpYVF1ZXJpZXMucmF3VmFsdWVzLnNtYWxsICsgXCJweFwiLCBoYXNCYWNrZ3JvdW5kRWxlbWVudFxyXG4gICAgICAgID8gc2hlZXRFbnRpdHkuZGVza3RvcEJvcmRlclJhZGl1cyArIFwiIFwiICsgc2hlZXRFbnRpdHkuZGVza3RvcEJvcmRlclJhZGl1cyArIFwiIDAgMCBcIlxyXG4gICAgICAgIDogXCJcIiArIHNoZWV0RW50aXR5LmRlc2t0b3BCb3JkZXJSYWRpdXMsIG1lZGlhUXVlcmllcy5yYXdWYWx1ZXMubWVkaXVtICsgXCJweFwiLCBoYXNCYWNrZ3JvdW5kRWxlbWVudCA/ICc1MCUnIDogJzEwMCUnLCBoYXNCYWNrZ3JvdW5kRWxlbWVudFxyXG4gICAgICAgID8gc2hlZXRFbnRpdHkuZGVza3RvcEJvcmRlclJhZGl1cyArIFwiIDAgMCBcIiArIHNoZWV0RW50aXR5LmRlc2t0b3BCb3JkZXJSYWRpdXNcclxuICAgICAgICA6IFwiXCIgKyBzaGVldEVudGl0eS5kZXNrdG9wQm9yZGVyUmFkaXVzKTsgfSxcclxuICAgIGRyYWdCYXI6IGNzcyh0ZW1wbGF0ZU9iamVjdF8zIHx8ICh0ZW1wbGF0ZU9iamVjdF8zID0gX19tYWtlVGVtcGxhdGVPYmplY3QoW1wiXFxuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKTtcXG4gIFwiXSwgW1wiXFxuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKTtcXG4gIFwiXSkpKSxcclxuICAgIGNoaWxkV3JhcHBlcjogY3NzKHRlbXBsYXRlT2JqZWN0XzQgfHwgKHRlbXBsYXRlT2JqZWN0XzQgPSBfX21ha2VUZW1wbGF0ZU9iamVjdChbXCJcXG4gICAgOjotd2Via2l0LXNjcm9sbGJhciB7XFxuICAgICAgd2lkdGg6IDBweDtcXG4gICAgICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDsgLyogbWFrZSBzY3JvbGxiYXIgdHJhbnNwYXJlbnQgKi9cXG4gICAgfVxcbiAgXCJdLCBbXCJcXG4gICAgOjotd2Via2l0LXNjcm9sbGJhciB7XFxuICAgICAgd2lkdGg6IDBweDtcXG4gICAgICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDsgLyogbWFrZSBzY3JvbGxiYXIgdHJhbnNwYXJlbnQgKi9cXG4gICAgfVxcbiAgXCJdKSkpLFxyXG59O1xyXG52YXIgdGVtcGxhdGVPYmplY3RfMSwgdGVtcGxhdGVPYmplY3RfMiwgdGVtcGxhdGVPYmplY3RfMywgdGVtcGxhdGVPYmplY3RfNDtcclxuLy8jIHNvdXJjZU1hcHBpbmdVUkw9c3R5bGVzLmpzLm1hcCJdfQ== */";
-var mediaQueries = entities$9.mediaQueries;
+var mediaQueries$1 = entities$9.mediaQueries;
 var styles$A = {
   sheetWrapper: function (mobile, layer) {
     return /*#__PURE__*/css(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n    position: ", ";\n    bottom: 0;\n    left: 0;\n    z-index: ", ";\n  " + _emotionSourceMap$C], ["\n    position: ", ";\n    bottom: 0;\n    left: 0;\n    z-index: ", ";\n  " + _emotionSourceMap$C])), mobile ? 'absolute' : 'relative', layer);
   },
   sheet: function (sheetEntity, hasBackgroundElement, isMobile, backgroundColor) {
-    return /*#__PURE__*/css(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n    width: 100%;\n    display: flex;\n    background-color: ", ";\n    place-items: start center;\n    place-content: start center;\n    flex-direction: column;\n    border-radius: ", ";\n    box-shadow: ", ";\n    padding: 48px 32px 32px 32px;\n    position: ", ";\n    bottom: ", ";\n    z-index: 3;\n    order: 2;\n    @media screen and (min-width: ", ") {\n      border-radius: ", ";\n    }\n    @media screen and (min-width: ", ") {\n      width: ", ";\n      order: 1;\n      border-radius: ", ";\n    }\n  " + _emotionSourceMap2$n], ["\n    width: 100%;\n    display: flex;\n    background-color: ", ";\n    place-items: start center;\n    place-content: start center;\n    flex-direction: column;\n    border-radius: ", ";\n    box-shadow: ", ";\n    padding: 48px 32px 32px 32px;\n    position: ", ";\n    bottom: ", ";\n    z-index: 3;\n    order: 2;\n    @media screen and (min-width: ", ") {\n      border-radius: ", ";\n    }\n    @media screen and (min-width: ", ") {\n      width: ", ";\n      order: 1;\n      border-radius: ", ";\n    }\n  " + _emotionSourceMap2$n])), backgroundColor || 'white', sheetEntity.mobileBorderRadius + " " + sheetEntity.mobileBorderRadius + " 0 0", sheetEntity.boxShadow, isMobile ? 'absolute' : 'relative', isMobile && 0, mediaQueries.rawValues.small + "px", hasBackgroundElement ? sheetEntity.desktopBorderRadius + " " + sheetEntity.desktopBorderRadius + " 0 0 " : "" + sheetEntity.desktopBorderRadius, mediaQueries.rawValues.medium + "px", hasBackgroundElement ? '50%' : '100%', hasBackgroundElement ? sheetEntity.desktopBorderRadius + " 0 0 " + sheetEntity.desktopBorderRadius : "" + sheetEntity.desktopBorderRadius);
+    return /*#__PURE__*/css(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n    width: 100%;\n    display: flex;\n    background-color: ", ";\n    place-items: start center;\n    place-content: start center;\n    flex-direction: column;\n    border-radius: ", ";\n    box-shadow: ", ";\n    padding: 48px 32px 32px 32px;\n    position: ", ";\n    bottom: ", ";\n    z-index: 3;\n    order: 2;\n    @media screen and (min-width: ", ") {\n      border-radius: ", ";\n    }\n    @media screen and (min-width: ", ") {\n      width: ", ";\n      order: 1;\n      border-radius: ", ";\n    }\n  " + _emotionSourceMap2$n], ["\n    width: 100%;\n    display: flex;\n    background-color: ", ";\n    place-items: start center;\n    place-content: start center;\n    flex-direction: column;\n    border-radius: ", ";\n    box-shadow: ", ";\n    padding: 48px 32px 32px 32px;\n    position: ", ";\n    bottom: ", ";\n    z-index: 3;\n    order: 2;\n    @media screen and (min-width: ", ") {\n      border-radius: ", ";\n    }\n    @media screen and (min-width: ", ") {\n      width: ", ";\n      order: 1;\n      border-radius: ", ";\n    }\n  " + _emotionSourceMap2$n])), backgroundColor || 'white', sheetEntity.mobileBorderRadius + " " + sheetEntity.mobileBorderRadius + " 0 0", sheetEntity.boxShadow, isMobile ? 'absolute' : 'relative', isMobile && 0, mediaQueries$1.rawValues.small + "px", hasBackgroundElement ? sheetEntity.desktopBorderRadius + " " + sheetEntity.desktopBorderRadius + " 0 0 " : "" + sheetEntity.desktopBorderRadius, mediaQueries$1.rawValues.medium + "px", hasBackgroundElement ? '50%' : '100%', hasBackgroundElement ? sheetEntity.desktopBorderRadius + " 0 0 " + sheetEntity.desktopBorderRadius : "" + sheetEntity.desktopBorderRadius);
   },
   dragBar: /*#__PURE__*/css(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n    transform: translateX(-50%);\n  ;label:dragBar;" + _emotionSourceMap3$f], ["\n    transform: translateX(-50%);\n  ;label:dragBar;" + _emotionSourceMap3$f]))),
   childWrapper: /*#__PURE__*/css(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n    ::-webkit-scrollbar {\n      width: 0px;\n      background: transparent; /* make scrollbar transparent */\n    }\n  ;label:childWrapper;" + _emotionSourceMap4$8], ["\n    ::-webkit-scrollbar {\n      width: 0px;\n      background: transparent; /* make scrollbar transparent */\n    }\n  ;label:childWrapper;" + _emotionSourceMap4$8])))
@@ -14978,7 +14978,10 @@ var Dialog = /*#__PURE__*/React.forwardRef(function (props, ref) {
     inset: insetOverride !== null && insetOverride !== void 0 ? insetOverride : dialog.defaultInset,
     outset: onClose ? {
       vertical: 'x0',
-      horizontal: 'x1'
+      horizontal: {
+        xSmall: 'x0',
+        small: 'x1'
+      }
     } : 'x0',
     maxWidth: maxWidth,
     maxHeight: maxHeight,
@@ -15735,10 +15738,11 @@ var Image$1 = function (_a) {
   }, title));
 };
 
-var _emotionSourceMap$s = process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFHeUQiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgX19tYWtlVGVtcGxhdGVPYmplY3QgfSBmcm9tIFwidHNsaWJcIjtcclxuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XHJcbmV4cG9ydCBkZWZhdWx0IHtcclxuICAgIGNsb3NlQnV0dG9uQ29udGFpbmVyOiBmdW5jdGlvbiAodG9wLCByaWdodCkgeyByZXR1cm4gY3NzKHRlbXBsYXRlT2JqZWN0XzEgfHwgKHRlbXBsYXRlT2JqZWN0XzEgPSBfX21ha2VUZW1wbGF0ZU9iamVjdChbXCJcXG4gICAgdG9wOiBcIiwgXCI7XFxuICAgIHJpZ2h0OiBcIiwgXCI7XFxuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlKDBweCwgMHB4KTtcXG4gICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIDAuMjVzIGVhc2U7XFxuICAgIHotaW5kZXg6IDEwO1xcbiAgICA6aG92ZXIge1xcbiAgICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlKC0ycHgsIDJweCk7XFxuICAgICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIDAuMjVzIGVhc2U7XFxuICAgIH1cXG4gIFwiXSwgW1wiXFxuICAgIHRvcDogXCIsIFwiO1xcbiAgICByaWdodDogXCIsIFwiO1xcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgwcHgsIDBweCk7XFxuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjI1cyBlYXNlO1xcbiAgICB6LWluZGV4OiAxMDtcXG4gICAgOmhvdmVyIHtcXG4gICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgtMnB4LCAycHgpO1xcbiAgICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjI1cyBlYXNlO1xcbiAgICB9XFxuICBcIl0pKSwgdG9wICE9PSBudWxsICYmIHRvcCAhPT0gdm9pZCAwID8gdG9wIDogJy0yM3B4JywgcmlnaHQgIT09IG51bGwgJiYgcmlnaHQgIT09IHZvaWQgMCA/IHJpZ2h0IDogJy0yM3B4Jyk7IH0sXHJcbn07XHJcbnZhciB0ZW1wbGF0ZU9iamVjdF8xO1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1zdHlsZXMuanMubWFwIl19 */";
+var _emotionSourceMap$s = process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLeUQiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgX19tYWtlVGVtcGxhdGVPYmplY3QgfSBmcm9tIFwidHNsaWJcIjtcclxuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY29yZSc7XHJcbmltcG9ydCB7IGVudGl0aWVzIH0gZnJvbSBcIi4uLy4uL3RoZW1lL3RoZW1pbmcvZW50aXRpZXNcIjtcclxudmFyIG1lZGlhUXVlcmllcyA9IGVudGl0aWVzLm1lZGlhUXVlcmllcztcclxuZXhwb3J0IGRlZmF1bHQge1xyXG4gICAgY2xvc2VCdXR0b25Db250YWluZXI6IGZ1bmN0aW9uICh0b3AsIHJpZ2h0KSB7IHJldHVybiBjc3ModGVtcGxhdGVPYmplY3RfMSB8fCAodGVtcGxhdGVPYmplY3RfMSA9IF9fbWFrZVRlbXBsYXRlT2JqZWN0KFtcIlxcbiAgICB0b3A6IFwiLCBcIjtcXG4gICAgcmlnaHQ6IFwiLCBcIjtcXG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoMHB4LCAwcHgpO1xcbiAgICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4yNXMgZWFzZTtcXG4gICAgei1pbmRleDogMTA7XFxuICAgIGJvcmRlci1yYWRpdXM6IDIwcHg7XFxuICAgIDpob3ZlciB7XFxuICAgICAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoLTJweCwgMnB4KTtcXG4gICAgICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gMC4yNXMgZWFzZTtcXG4gICAgfVxcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiBcIiwgXCIpIHtcXG4gICAgICBib3JkZXItcmFkaXVzOiAxMXB4O1xcbiAgICAgIHRvcDogXCIsIFwiO1xcbiAgICAgIHJpZ2h0OiBcIiwgXCI7XFxuICAgIH1cXG4gIFwiXSwgW1wiXFxuICAgIHRvcDogXCIsIFwiO1xcbiAgICByaWdodDogXCIsIFwiO1xcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgwcHgsIDBweCk7XFxuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjI1cyBlYXNlO1xcbiAgICB6LWluZGV4OiAxMDtcXG4gICAgYm9yZGVyLXJhZGl1czogMjBweDtcXG4gICAgOmhvdmVyIHtcXG4gICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgtMnB4LCAycHgpO1xcbiAgICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSAwLjI1cyBlYXNlO1xcbiAgICB9XFxuICAgIEBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IFwiLCBcIikge1xcbiAgICAgIGJvcmRlci1yYWRpdXM6IDExcHg7XFxuICAgICAgdG9wOiBcIiwgXCI7XFxuICAgICAgcmlnaHQ6IFwiLCBcIjtcXG4gICAgfVxcbiAgXCJdKSksIHRvcCAhPT0gbnVsbCAmJiB0b3AgIT09IHZvaWQgMCA/IHRvcCA6ICctMjNweCcsIHJpZ2h0ICE9PSBudWxsICYmIHJpZ2h0ICE9PSB2b2lkIDAgPyByaWdodCA6ICctMjNweCcsIG1lZGlhUXVlcmllcy5yYXdWYWx1ZXMuc21hbGwgKyBcInB4XCIsIHRvcCAhPT0gbnVsbCAmJiB0b3AgIT09IHZvaWQgMCA/IHRvcCA6ICc3cHgnLCByaWdodCAhPT0gbnVsbCAmJiByaWdodCAhPT0gdm9pZCAwID8gcmlnaHQgOiAnN3B4Jyk7IH0sXHJcbn07XHJcbnZhciB0ZW1wbGF0ZU9iamVjdF8xO1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1zdHlsZXMuanMubWFwIl19 */";
+var mediaQueries = entities$9.mediaQueries;
 var styles$q = {
   closeButtonContainer: function (top, right) {
-    return /*#__PURE__*/css(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n    top: ", ";\n    right: ", ";\n    transform: translate(0px, 0px);\n    transition: transform 0.25s ease;\n    z-index: 10;\n    :hover {\n      transform: translate(-2px, 2px);\n      transition: transform 0.25s ease;\n    }\n  " + _emotionSourceMap$s], ["\n    top: ", ";\n    right: ", ";\n    transform: translate(0px, 0px);\n    transition: transform 0.25s ease;\n    z-index: 10;\n    :hover {\n      transform: translate(-2px, 2px);\n      transition: transform 0.25s ease;\n    }\n  " + _emotionSourceMap$s])), top !== null && top !== void 0 ? top : '-23px', right !== null && right !== void 0 ? right : '-23px');
+    return /*#__PURE__*/css(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n    top: ", ";\n    right: ", ";\n    transform: translate(0px, 0px);\n    transition: transform 0.25s ease;\n    z-index: 10;\n    border-radius: 20px;\n    :hover {\n      transform: translate(-2px, 2px);\n      transition: transform 0.25s ease;\n    }\n    @media screen and (max-width: ", ") {\n      border-radius: 11px;\n      top: ", ";\n      right: ", ";\n    }\n  " + _emotionSourceMap$s], ["\n    top: ", ";\n    right: ", ";\n    transform: translate(0px, 0px);\n    transition: transform 0.25s ease;\n    z-index: 10;\n    border-radius: 20px;\n    :hover {\n      transform: translate(-2px, 2px);\n      transition: transform 0.25s ease;\n    }\n    @media screen and (max-width: ", ") {\n      border-radius: 11px;\n      top: ", ";\n      right: ", ";\n    }\n  " + _emotionSourceMap$s])), top !== null && top !== void 0 ? top : '-23px', right !== null && right !== void 0 ? right : '-23px', mediaQueries.rawValues.small + "px", top !== null && top !== void 0 ? top : '7px', right !== null && right !== void 0 ? right : '7px');
   }
 };
 var templateObject_1$s;
@@ -15758,8 +15762,10 @@ var CloseButton = function (_a) {
     display: "flex",
     justifyContent: "center",
     alignItems: "center",
-    inset: "x3",
-    borderRadius: '20px',
+    inset: {
+      xSmall: 'x2',
+      small: 'x3'
+    },
     boxShadow: 'mediumLight',
     backgroundColor: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : '#424242e0',
     position: "absolute",
@@ -18180,13 +18186,9 @@ var AccountMenu = function (_a) {
 };
 
 var Banner = function (_a) {
-  var icon = _a.icon,
-    message = _a.message,
-    status = _a.status,
-    children = _a.children,
-    _b = _a.outlined,
-    outlined = _b === void 0 ? true : _b,
-    onClose = _a.onClose;
+  var _b = _a.isOutlined,
+    isOutlined = _b === void 0 ? true : _b,
+    props = __rest(_a, ["isOutlined"]);
   var _c = useState(false),
     isHovering = _c[0],
     setIsHovering = _c[1];
@@ -18195,13 +18197,13 @@ var Banner = function (_a) {
   return jsx(Flex, {
     width: "100%",
     backgroundColor: {
-      swatch: status === 'success' ? 'success' : status === 'warning' ? 'warning' : 'danger',
-      shade: outlined ? '_1000' : 'base'
+      swatch: props.status === 'success' ? 'success' : props.status === 'warning' ? 'warning' : 'danger',
+      shade: isOutlined ? '_1000' : 'base'
     },
-    borderWidth: outlined ? 'default' : undefined,
-    borderStyle: outlined ? 'solid' : undefined,
-    borderColor: outlined ? {
-      swatch: status === 'success' ? 'success' : status === 'warning' ? 'warning' : 'danger',
+    borderWidth: isOutlined ? 'default' : undefined,
+    borderStyle: isOutlined ? 'solid' : undefined,
+    borderColor: isOutlined ? {
+      swatch: props.status === 'success' ? 'success' : props.status === 'warning' ? 'warning' : 'danger',
       shade: 'base'
     } : undefined,
     inset: {
@@ -18211,31 +18213,31 @@ var Banner = function (_a) {
     borderRadius: "default",
     justifyContent: "flex-start",
     alignItems: "center"
-  }, jsx(Flex, {
+  }, props.bannerTitle ? jsx(Flex, {
     width: "100%"
-  }, icon && jsx(Flex, {
+  }, props.bannerTitle.icon && jsx(Flex, {
     justifyContent: "center",
     alignItems: "center",
     inset: {
       horizontal: 'x1'
     }
   }, jsx(Icon, {
-    name: icon,
+    name: props.bannerTitle.icon,
     size: "small",
-    primaryColor: outlined ? 'primaryBodyText' : 'inverseHeadingText'
-  })), message && jsx(Flex, {
+    primaryColor: isOutlined ? 'primaryBodyText' : 'inverseHeadingText'
+  })), jsx(Flex, {
     width: "100%"
   }, jsx(Text, {
-    content: message,
-    color: outlined ? 'primaryBody' : 'inverseHeading',
+    content: props.bannerTitle.message,
+    color: isOutlined ? 'primaryBody' : 'inverseHeading',
     type: {
       xSmall: 'footnote',
       small: 'caption'
     }
-  }))), children && jsx(Flex, {
+  }))) : jsx(Flex, {
     width: "100%",
     alignItems: "center"
-  }, children), onClose && jsx(Flex, {
+  }, props.children), props.onClose && jsx(Flex, {
     justifyContent: "flex-end",
     alignItems: "center",
     outset: {
@@ -18249,7 +18251,7 @@ var Banner = function (_a) {
       return setIsHovering(false);
     }
   }, jsx(Flex, {
-    onClick: onClose,
+    onClick: props.onClose,
     width: "40px",
     height: "40px",
     justifyContent: "center",

package/dist/src/organisms/banner/banner.d.ts

@@ -1,12 +1,23 @@
 import React from 'react';
 import { IconType } from "../../atoms/iconography/types";
-export declare type BannerProps = {
+declare type BannerDetail = {
+    message: string;
     icon?: IconType;
-    message?: string;
+};
+declare type StatusType = 'success' | 'warning' | 'danger';
+declare type BaseBannerProps = {
     status: StatusType;
-    outlined?: boolean;
-    children?: React.ReactNode;
+    isOutlined?: boolean;
     onClose?: () => void;
 };
-export declare type StatusType = 'success' | 'warning' | 'danger';
-export declare const Banner: ({ icon, message, status, children, outlined, onClose, }: BannerProps) => JSX.Element;
+declare type BannerWithTitle = BaseBannerProps & {
+    bannerTitle: BannerDetail;
+    children?: never;
+};
+declare type BannerWithChildren = BaseBannerProps & {
+    children: React.ReactNode;
+    bannerTitle?: never;
+};
+export declare type BannerProps = BannerWithTitle | BannerWithChildren;
+export declare const Banner: ({ isOutlined, ...props }: BannerProps) => JSX.Element;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sendoutcards/quantum-design-ui",
-  "version": "1.8.0",
+  "version": "1.8.2",
   "description": "UI component library for Quantum Design System",
   "module": "dist/index.es.js",
   "jsnext:main": "dist/index.es.js",