@artsy/palette 44.0.1 → 44.2.0

package/dist/elements/Image/Image.story.js

@@ -3,123 +3,141 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.WithStyledImage = exports.WithCustomStyle = exports.ImageLazyLoadSrcSetPlaceHolderURL = exports.ImageLazyLoadSrcSet = exports.ImageLazyLoad = exports.EnsuresImageDoesNotCollapse = exports.Default = void 0;
+exports.default = exports.WithStyledImage = exports.WithSrcSet = exports.WithPlaceholder = exports.WithCustomStyle = exports.ImageLazyLoadSrcSetPlaceHolderURL = exports.ImageLazyLoadSrcSet = exports.ImageLazyLoad = exports.EnsuresImageDoesNotCollapse = exports.Default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _Image = require("../Image");
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _Box = require("../Box");
-var _storybookStates = require("storybook-states");
+var _storybookBlocklist = require("../../utils/storybookBlocklist");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var blurhashDataUri = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAQK0lEQVR4AQEgEN/vAP////////////////////////z//vr3//r18f/17ur/7+fi/+ng2v/j2NH/3c/J/9fHwf/SwLn/zbmz/8m0rv/Hsav/xrCr/8eyrf/KtrH/zru3/9PDv//Zy8j/4NTR/+fd2v/u5+P/9O/r//r38////fn////+////////////AP////////////////////////v//vr2//n08P/07un/7+fi/+nf2f/j19H/3c/I/9fHwP/Rv7j/zLmy/8m0rf/Hsar/xrCq/8exrP/JtbD/zbu3/9LCvv/Zysf/39TQ/+bd2v/t5uP/9O/r//r28v///fn////+////////////AP///////////////////////vv//fn2//n08P/07en/7ubh/+je2P/i1s//283H/9XFvv/Qvbb/y7ew/8exq//Frqj/xK2o/8Wvqv/Hsq7/y7i1/9HAvf/XycX/3tLP/+Xc2P/t5eL/8+7q//r28v///fj////+////////////AP///////////////////v///fr//Pn1//jz7v/z7Of/7eXf/+fd1v/g1M3/2cvE/9PDu//NurP/yLOs/8Sup//BqqT/wamj/8Grpv/Er6r/yLWx/869uv/VxsP/3NDN/+Ta1//r5OD/8u3p//n18f/+/Pf////9////////////AP///////////////////v///Pn/+/f0//bx7f/x6uX/6+Pd/+Xa1P/e0cr/18jA/9C/t//Ktq7/xK+n/8Cpof+9pZ7/vKOe/72loP/AqaX/xLCs/8q4tf/Rwr//2c3K/+HX1P/p4d7/8evn//f07//9+/b////8////////////AP///////////////////f/++/j/+vby//Xw6//v6OP/6eDa/+LX0P/bzsb/08S8/8y6sv/Fsaj/v6mg/7uimv+3npf/tpyW/7eemf+6op7/v6qm/8WzsP/Nvbv/1cnG/97U0f/m39v/7unl//by7v/8+vX////7////////////AP/////////////////++//8+fb/+PTw//Pu6f/t5uD/5t3X/9/Uzf/XysL/z7+2/8i1q//Aq6H/uqGY/7Sakf+xlY3/r5ON/7CVkP+0mpb/uaKf/8Csqv/IuLb/0cTB/9rQzf/k3Nj/7Obj//Tw7P/7+PP////6/////v//////AP/////////////+//78+v/6+PX/9vLu//Hr5//q497/49rT/9zQyP/Uxbz/y7qw/8OvpP+6o5n/s5mP/62Rh/+pi4L/qImC/6iLhv+skI3/spmX/7qlo//Dsa//zL+9/9bMyf/g2NX/6uTg//Lu6v/59/L///74/////f//////AP////////////78//z6+f/59vP/9PDs/+7p5P/o4dr/4NfQ/9jMxP/Pwbf/xrSq/72onP+0m4//rJCE/6WGe/+hf3b/n3x1/6B/ef+khYL/qo+N/7Ocm/+9qqn/x7m3/9LHxf/d1dL/5+Hd//Ds5//49fD//vz3/////P//////AP///////v7//fz7//v59//39PH/8u7q/+zm4f/l3tf/3dTM/9XIv//LvLH/wa6i/7ehk/+uk4X/pYV4/516bf+Ycmf/lm5m/5dxa/+beXb/ooWD/6uTkv+2o6L/wrOy/87CwP/Z0c7/5N7a/+7q5f/28+7//Pv1////+v////7/AP7+/v/9/f3//Pv6//n39v/18vD/8Ozo/+rk3//j29T/2tDI/9HEuv/Ht6v/vaib/7KZiv+niXr/nXpq/5VtXf+PYlX/jF5U/41hW/+Sa2j/mnl4/6SJif+wm5v/va2s/8q9vP/Wzcr/4dvY/+zo4//08uz/+/r0////+f////z/APz8/f/8/Pz/+vn5//f29f/z8e7/7urm/+ji3P/g2NH/2M3E/87Atf/DsqX/uKKU/6ySgf+hgG7/lm5b/4xeSv+FUT//gks+/4NPSP+IW1n/kWxs/52AgP+qlJT/uKem/8a5uP/Tysf/39nV/+rm4f/z8Ov/+vny////+P////v/APv7/P/7+/v/+fj4//b08//y7+3/7Ojl/+bg2v/e1s7/1crB/8u8sf/AraD/tJ2N/6eKeP+bd2L/j2JL/4ROM/98PB7/eTQc/3o5MP+ASkj/iWBg/5Z2eP+kjI3/s6Gh/8K1tP/QxsT/3dbT/+jk3//y7+n/+fjx///+9/////v/APr6+//6+vr/+Pf3//Xz8v/w7uz/6+fj/+Te2P/c1Mz/08e+/8i5rf+9qZv/sJiH/6OEcP+Wblb/iVc4/309B/90IQD/cAgA/3EaAP94Nzb/g1NV/5BucP+ghof/r52d/7+xsP/OxMH/29TR/+fi3f/w7uj/+Pfw//7+9v////r/APn6+//5+fr/9/f3//Tz8v/v7ev/6ubi/+Pd1//b0sr/0cW7/8a3qv+7ppf/rpSB/6B/af+SZ0z/hEwj/3cqAP9uAAD/aQAA/2oAAP9xIR//fUhL/4xmaf+cgYP/rZma/72urv/Mwr//2dPP/+Xh3P/w7ef/+Pfw//799v////n/APn5+v/4+Pn/9vb2//Py8f/v7Or/6eXh/+Lc1v/a0cn/0MS6/8W1qP+5pJT/rJF+/557Y/+PYkP/gUMC/3QUAP9qAAD/ZQAA/2YAAP9tAAD/ej9D/4lhZP+afYD/q5aX/7utrP/LwL7/2dLO/+Xg2//v7ef/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eTh/+Lb1f/Z0Mj/0MO5/8W0p/+4o5P/q497/515YP+OXz7/gD4A/3MAAP9oAAD/YwAA/2QAAP9sAAD/eTo+/4heYv+ZfH7/qpWW/7usq//KwL7/2NHO/+Xg2//v7Ob/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eXh/+Lb1f/a0Mj/0MO5/8W0p/+5opL/rI97/554YP+PXj3/gT4A/3QAAP9qAAD/ZQAA/2YAAP9tAAD/ejs//4lfYv+afH7/q5aW/7usq//KwL7/2NHO/+Xg2//v7eb/9/bv//399f////n/APn6+//4+fr/9vb3//Py8f/v7Or/6eXh/+Lc1v/a0cn/0cO5/8a0qP+6o5T/rZB9/596Y/+RYUL/hEIA/3cSAP9uAAD/aQAA/2oAAP9yBwP/fUFE/4xjZv+cf4H/rJeY/7ytrf/Mwb//2dLP/+Xh3P/v7ef/+Pfw//399v////n/APn6+//5+vr/9/f3//Tz8v/w7ev/6ubi/+Pd1//b0sr/0sW7/8i2qv+8pZb/sJKA/6N9Z/+VZkr/iEof/30oAP90AAD/cAAA/3EAAP94JiP/g0tN/5Bpa/+gg4T/r5qb/7+wr//Nw8D/29TQ/+bi3f/w7uj/+Pfw//7+9v////r/APr7/P/5+vv/+Pj4//X08//w7uz/6+fj/+Xe2P/d08z/1Me9/8q4rP+/qJr/s5aF/6eCbv+abFT/jlQ1/4Q6AP98HwD/eQsA/3oeBP+AOzj/ilZX/5Zwcv+kiIn/s5+f/8Kzsv/QxcP/3NXS/+jj3v/x7+n/+fjx//7+9/////v/APv8/f/6/Pz/+fn5//b19P/y8O3/7ejl/+bg2v/f1c7/1snA/827sP/Cq57/t5qL/6yIdv+gdF//lV9H/4xLLv+FOhn/gjMa/4M7Mf+ITUr/kWNi/515ev+qj4//uKSj/8W3tf/TyMb/39jU/+nl4P/y8Or/+vny////+P////v/APz+/v/7/f3/+vr6//f39f/z8e//7urm/+jh3P/h19D/2cvD/9C+tP/Gr6P/vJ+R/7GOfv+mfGr/nWtX/5RaRv+PTjv/jEo8/41PSP+SXVr/mm9u/6SCgv+wlpb/vamo/8m7uf/Wy8n/4drW/+vn4v/08ez/+/r0////+f////z/AP3////9/v7/+/z7//j49v/18/D/8Ozo/+rj3v/k2tP/3M7G/9PCuP/KtKj/wKWY/7eVhv+thXX/pHVl/51oWP+YX1D/llxR/5dgWv+ba2j/onp5/6uLi/+2nZz/wq+u/86/vf/Zz8z/5N3Z/+3p5P/18+7//Pv1////+v////3/AP7////+/////P38//r6+P/29PL/8u7q/+zm4f/m3Nb/39HJ/9fFvP/OuK3/xaqe/7ybjv+0jX//rIBy/6V0Z/+hbWH/n2ti/6Bvaf+keHT/qoWD/7OUk/+9pKP/x7Wz/9LEwv/d0tD/5uDc/+/r5v/39e///fz2////+///////AP///////////v/9//v7+f/49vP/9PDs/+7o4//o39n/4tTN/9rJwP/SvLL/yq+k/8Kilv+6lYn/s4l9/61/dP+peW//qHhw/6l8dv+shID/so+M/7qdm//Dq6n/zLq4/9bIxv/g1tP/6eLf//Ht6f/49vH//v34/////f//////AP/////////////+//39+v/5+PX/9fHu//Dq5f/r4dv/5NfQ/93MxP/WwLf/zrSq/8eonf/AnJH/uZGG/7SJf/+xhHv/sIN8/7GGgf+0jon/uZiV/8Ckov/Isq//0b+9/9rNyv/j2db/7OXh//Pv6//6+PP///75/////v//////AP////////////////7++//7+fb/9/Pv//Ls5//t497/59nT/+DPyP/ZxLz/0riv/8uto//Fopj/v5iP/7qRiP+3jYX/toyF/7ePiv+6lpL/v5+c/8WrqP/Nt7T/1cTB/97Qzf/m3Nn/7ufj//Xx7f/7+fT////6////////////AP///////////////////P/8+vf/+PTx//Tt6f/v5eD/6dzW/+PSy//cx7//1by0/8+xqP/Jp57/xJ6W/8CYj/+9lIz/vJSN/72Xkf/AnZj/xKai/8qwrf/RvLn/2cjF/+HU0P/o39v/8Onl//fy7v/8+vb////8////////////AP///////////////////f/9+/j/+vby//Xv6v/w5uH/693Y/+XUzf/eycL/2L+3/9K1rf/Mq6P/yKOb/8Sdlf/BmpL/wZqT/8Kdl//Eop7/yKun/861sf/VwLz/3MvI/+PW0//q4d3/8evn//j08P/9+/f////8////////////AP///////////////////v/+/Pn/+vbz//bv6//x6OP/7N/Z/+bVz//gy8T/2sG6/9S3r//Prqb/yqef/8ehmf/Fnpf/xJ6X/8Whm//HpqL/y66q/9G4tP/Xwr//3s3K/+XY1f/s49//8+zo//n18f/+/Pj////9////////////AP///////////////////v/+/fn/+/fz//fw7P/y6OP/7eDa/+fW0P/hzMb/28K7/9a5sf/RsKj/zKmh/8mjnP/HoJn/xqCa/8ejnv/JqaT/zbCs/9K6tv/YxMD/38/L/+bZ1v/t4+D/8+3p//n18f/+/Pj////+////////////HCU4UCaYN3YAAAAASUVORK5CYII=";
 var _default = exports.default = {
-  title: "Components/Image"
+  component: _Image.Image,
+  title: "Components/Image",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "An optimized image component with support for lazy loading, srcSet, and placeholder images."
+      }
+    },
+    controls: {
+      exclude: _storybookBlocklist.STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
 };
-var Default = exports.Default = function Default() {
-  return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
-    states: [{}, {
-      src: "https://picsum.photos/seed/example/300/200",
-      srcSet: "https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x"
-    }, {
-      placeHolderURL: blurhashDataUri
-    }]
-  }, /*#__PURE__*/_react.default.createElement(_Image.Image, {
+var Default = exports.Default = {
+  args: {
     id: "example",
     className: "example",
     width: "300px",
     height: "200px",
     src: "https://picsum.photos/seed/example/300/200"
-  }));
-};
-Default.displayName = "Default";
-Default.story = {
-  name: "Image"
+  }
 };
-var ImageLazyLoad = exports.ImageLazyLoad = function ImageLazyLoad() {
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, Array.from(Array(100)).map(function (_, i) {
-    return /*#__PURE__*/_react.default.createElement(_Image.Image, {
-      key: i,
-      lazyLoad: true,
-      width: "300px",
-      height: "200px",
-      src: "https://picsum.photos/seed/".concat(i, "/300/200")
-    });
-  }));
+var WithSrcSet = exports.WithSrcSet = {
+  args: {
+    id: "example",
+    className: "example",
+    width: "300px",
+    height: "200px",
+    src: "https://picsum.photos/seed/example/300/200",
+    srcSet: "https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x"
+  }
 };
-ImageLazyLoad.story = {
-  name: "Image + lazyLoad"
+var WithPlaceholder = exports.WithPlaceholder = {
+  args: {
+    id: "example",
+    className: "example",
+    width: "300px",
+    height: "200px",
+    src: "https://picsum.photos/seed/example/300/200",
+    placeHolderURL: blurhashDataUri
+  }
 };
-var ImageLazyLoadSrcSet = exports.ImageLazyLoadSrcSet = function ImageLazyLoadSrcSet() {
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, Array.from(Array(100)).map(function (_, i) {
-    return /*#__PURE__*/_react.default.createElement(_Image.Image, {
-      key: i,
-      lazyLoad: true,
-      width: "300px",
-      height: "200px",
-      src: "https://picsum.photos/seed/".concat(i, "/300/200"),
-      srcSet: "https://picsum.photos/seed/".concat(i, "/300/200 1x, https://picsum.photos/seed/").concat(i, "/600/400 2x")
-    });
-  }));
+var ImageLazyLoad = exports.ImageLazyLoad = {
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, Array.from(Array(100)).map(function (_, i) {
+      return /*#__PURE__*/_react.default.createElement(_Image.Image, {
+        key: i,
+        lazyLoad: true,
+        width: "300px",
+        height: "200px",
+        src: "https://picsum.photos/seed/".concat(i, "/300/200")
+      });
+    }));
+  }
 };
-ImageLazyLoadSrcSet.story = {
-  name: "Image + lazyLoad + srcSet"
+var ImageLazyLoadSrcSet = exports.ImageLazyLoadSrcSet = {
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, Array.from(Array(100)).map(function (_, i) {
+      return /*#__PURE__*/_react.default.createElement(_Image.Image, {
+        key: i,
+        lazyLoad: true,
+        width: "300px",
+        height: "200px",
+        src: "https://picsum.photos/seed/".concat(i, "/300/200"),
+        srcSet: "https://picsum.photos/seed/".concat(i, "/300/200 1x, https://picsum.photos/seed/").concat(i, "/600/400 2x")
+      });
+    }));
+  }
 };
-var ImageLazyLoadSrcSetPlaceHolderURL = exports.ImageLazyLoadSrcSetPlaceHolderURL = function ImageLazyLoadSrcSetPlaceHolderURL() {
-  return /*#__PURE__*/_react.default.createElement(_Image.Image, {
+var ImageLazyLoadSrcSetPlaceHolderURL = exports.ImageLazyLoadSrcSetPlaceHolderURL = {
+  args: {
     lazyLoad: true,
     width: "300px",
     height: "200px",
-    placeHolderURL: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAQK0lEQVR4AQEgEN/vAP////////////////////////z//vr3//r18f/17ur/7+fi/+ng2v/j2NH/3c/J/9fHwf/SwLn/zbmz/8m0rv/Hsav/xrCr/8eyrf/KtrH/zru3/9PDv//Zy8j/4NTR/+fd2v/u5+P/9O/r//r38////fn////+////////////AP////////////////////////v//vr2//n08P/07un/7+fi/+nf2f/j19H/3c/I/9fHwP/Rv7j/zLmy/8m0rf/Hsar/xrCq/8exrP/JtbD/zbu3/9LCvv/Zysf/39TQ/+bd2v/t5uP/9O/r//r28v///fn////+////////////AP///////////////////////vv//fn2//n08P/07en/7ubh/+je2P/i1s//283H/9XFvv/Qvbb/y7ew/8exq//Frqj/xK2o/8Wvqv/Hsq7/y7i1/9HAvf/XycX/3tLP/+Xc2P/t5eL/8+7q//r28v///fj////+////////////AP///////////////////v///fr//Pn1//jz7v/z7Of/7eXf/+fd1v/g1M3/2cvE/9PDu//NurP/yLOs/8Sup//BqqT/wamj/8Grpv/Er6r/yLWx/869uv/VxsP/3NDN/+Ta1//r5OD/8u3p//n18f/+/Pf////9////////////AP///////////////////v///Pn/+/f0//bx7f/x6uX/6+Pd/+Xa1P/e0cr/18jA/9C/t//Ktq7/xK+n/8Cpof+9pZ7/vKOe/72loP/AqaX/xLCs/8q4tf/Rwr//2c3K/+HX1P/p4d7/8evn//f07//9+/b////8////////////AP///////////////////f/++/j/+vby//Xw6//v6OP/6eDa/+LX0P/bzsb/08S8/8y6sv/Fsaj/v6mg/7uimv+3npf/tpyW/7eemf+6op7/v6qm/8WzsP/Nvbv/1cnG/97U0f/m39v/7unl//by7v/8+vX////7////////////AP/////////////////++//8+fb/+PTw//Pu6f/t5uD/5t3X/9/Uzf/XysL/z7+2/8i1q//Aq6H/uqGY/7Sakf+xlY3/r5ON/7CVkP+0mpb/uaKf/8Csqv/IuLb/0cTB/9rQzf/k3Nj/7Obj//Tw7P/7+PP////6/////v//////AP/////////////+//78+v/6+PX/9vLu//Hr5//q497/49rT/9zQyP/Uxbz/y7qw/8OvpP+6o5n/s5mP/62Rh/+pi4L/qImC/6iLhv+skI3/spmX/7qlo//Dsa//zL+9/9bMyf/g2NX/6uTg//Lu6v/59/L///74/////f//////AP////////////78//z6+f/59vP/9PDs/+7p5P/o4dr/4NfQ/9jMxP/Pwbf/xrSq/72onP+0m4//rJCE/6WGe/+hf3b/n3x1/6B/ef+khYL/qo+N/7Ocm/+9qqn/x7m3/9LHxf/d1dL/5+Hd//Ds5//49fD//vz3/////P//////AP///////v7//fz7//v59//39PH/8u7q/+zm4f/l3tf/3dTM/9XIv//LvLH/wa6i/7ehk/+uk4X/pYV4/516bf+Ycmf/lm5m/5dxa/+beXb/ooWD/6uTkv+2o6L/wrOy/87CwP/Z0c7/5N7a/+7q5f/28+7//Pv1////+v////7/AP7+/v/9/f3//Pv6//n39v/18vD/8Ozo/+rk3//j29T/2tDI/9HEuv/Ht6v/vaib/7KZiv+niXr/nXpq/5VtXf+PYlX/jF5U/41hW/+Sa2j/mnl4/6SJif+wm5v/va2s/8q9vP/Wzcr/4dvY/+zo4//08uz/+/r0////+f////z/APz8/f/8/Pz/+vn5//f29f/z8e7/7urm/+ji3P/g2NH/2M3E/87Atf/DsqX/uKKU/6ySgf+hgG7/lm5b/4xeSv+FUT//gks+/4NPSP+IW1n/kWxs/52AgP+qlJT/uKem/8a5uP/Tysf/39nV/+rm4f/z8Ov/+vny////+P////v/APv7/P/7+/v/+fj4//b08//y7+3/7Ojl/+bg2v/e1s7/1crB/8u8sf/AraD/tJ2N/6eKeP+bd2L/j2JL/4ROM/98PB7/eTQc/3o5MP+ASkj/iWBg/5Z2eP+kjI3/s6Gh/8K1tP/QxsT/3dbT/+jk3//y7+n/+fjx///+9/////v/APr6+//6+vr/+Pf3//Xz8v/w7uz/6+fj/+Te2P/c1Mz/08e+/8i5rf+9qZv/sJiH/6OEcP+Wblb/iVc4/309B/90IQD/cAgA/3EaAP94Nzb/g1NV/5BucP+ghof/r52d/7+xsP/OxMH/29TR/+fi3f/w7uj/+Pfw//7+9v////r/APn6+//5+fr/9/f3//Tz8v/v7ev/6ubi/+Pd1//b0sr/0cW7/8a3qv+7ppf/rpSB/6B/af+SZ0z/hEwj/3cqAP9uAAD/aQAA/2oAAP9xIR//fUhL/4xmaf+cgYP/rZma/72urv/Mwr//2dPP/+Xh3P/w7ef/+Pfw//799v////n/APn5+v/4+Pn/9vb2//Py8f/v7Or/6eXh/+Lc1v/a0cn/0MS6/8W1qP+5pJT/rJF+/557Y/+PYkP/gUMC/3QUAP9qAAD/ZQAA/2YAAP9tAAD/ej9D/4lhZP+afYD/q5aX/7utrP/LwL7/2dLO/+Xg2//v7ef/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eTh/+Lb1f/Z0Mj/0MO5/8W0p/+4o5P/q497/515YP+OXz7/gD4A/3MAAP9oAAD/YwAA/2QAAP9sAAD/eTo+/4heYv+ZfH7/qpWW/7usq//KwL7/2NHO/+Xg2//v7Ob/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eXh/+Lb1f/a0Mj/0MO5/8W0p/+5opL/rI97/554YP+PXj3/gT4A/3QAAP9qAAD/ZQAA/2YAAP9tAAD/ejs//4lfYv+afH7/q5aW/7usq//KwL7/2NHO/+Xg2//v7eb/9/bv//399f////n/APn6+//4+fr/9vb3//Py8f/v7Or/6eXh/+Lc1v/a0cn/0cO5/8a0qP+6o5T/rZB9/596Y/+RYUL/hEIA/3cSAP9uAAD/aQAA/2oAAP9yBwP/fUFE/4xjZv+cf4H/rJeY/7ytrf/Mwb//2dLP/+Xh3P/v7ef/+Pfw//399v////n/APn6+//5+vr/9/f3//Tz8v/w7ev/6ubi/+Pd1//b0sr/0sW7/8i2qv+8pZb/sJKA/6N9Z/+VZkr/iEof/30oAP90AAD/cAAA/3EAAP94JiP/g0tN/5Bpa/+gg4T/r5qb/7+wr//Nw8D/29TQ/+bi3f/w7uj/+Pfw//7+9v////r/APr7/P/5+vv/+Pj4//X08//w7uz/6+fj/+Xe2P/d08z/1Me9/8q4rP+/qJr/s5aF/6eCbv+abFT/jlQ1/4Q6AP98HwD/eQsA/3oeBP+AOzj/ilZX/5Zwcv+kiIn/s5+f/8Kzsv/QxcP/3NXS/+jj3v/x7+n/+fjx//7+9/////v/APv8/f/6/Pz/+fn5//b19P/y8O3/7ejl/+bg2v/f1c7/1snA/827sP/Cq57/t5qL/6yIdv+gdF//lV9H/4xLLv+FOhn/gjMa/4M7Mf+ITUr/kWNi/515ev+qj4//uKSj/8W3tf/TyMb/39jU/+nl4P/y8Or/+vny////+P////v/APz+/v/7/f3/+vr6//f39f/z8e//7urm/+jh3P/h19D/2cvD/9C+tP/Gr6P/vJ+R/7GOfv+mfGr/nWtX/5RaRv+PTjv/jEo8/41PSP+SXVr/mm9u/6SCgv+wlpb/vamo/8m7uf/Wy8n/4drW/+vn4v/08ez/+/r0////+f////z/AP3////9/v7/+/z7//j49v/18/D/8Ozo/+rj3v/k2tP/3M7G/9PCuP/KtKj/wKWY/7eVhv+thXX/pHVl/51oWP+YX1D/llxR/5dgWv+ba2j/onp5/6uLi/+2nZz/wq+u/86/vf/Zz8z/5N3Z/+3p5P/18+7//Pv1////+v////3/AP7////+/////P38//r6+P/29PL/8u7q/+zm4f/m3Nb/39HJ/9fFvP/OuK3/xaqe/7ybjv+0jX//rIBy/6V0Z/+hbWH/n2ti/6Bvaf+keHT/qoWD/7OUk/+9pKP/x7Wz/9LEwv/d0tD/5uDc/+/r5v/39e///fz2////+///////AP///////////v/9//v7+f/49vP/9PDs/+7o4//o39n/4tTN/9rJwP/SvLL/yq+k/8Kilv+6lYn/s4l9/61/dP+peW//qHhw/6l8dv+shID/so+M/7qdm//Dq6n/zLq4/9bIxv/g1tP/6eLf//Ht6f/49vH//v34/////f//////AP/////////////+//39+v/5+PX/9fHu//Dq5f/r4dv/5NfQ/93MxP/WwLf/zrSq/8eonf/AnJH/uZGG/7SJf/+xhHv/sIN8/7GGgf+0jon/uZiV/8Ckov/Isq//0b+9/9rNyv/j2db/7OXh//Pv6//6+PP///75/////v//////AP////////////////7++//7+fb/9/Pv//Ls5//t497/59nT/+DPyP/ZxLz/0riv/8uto//Fopj/v5iP/7qRiP+3jYX/toyF/7ePiv+6lpL/v5+c/8WrqP/Nt7T/1cTB/97Qzf/m3Nn/7ufj//Xx7f/7+fT////6////////////AP///////////////////P/8+vf/+PTx//Tt6f/v5eD/6dzW/+PSy//cx7//1by0/8+xqP/Jp57/xJ6W/8CYj/+9lIz/vJSN/72Xkf/AnZj/xKai/8qwrf/RvLn/2cjF/+HU0P/o39v/8Onl//fy7v/8+vb////8////////////AP///////////////////f/9+/j/+vby//Xv6v/w5uH/693Y/+XUzf/eycL/2L+3/9K1rf/Mq6P/yKOb/8Sdlf/BmpL/wZqT/8Kdl//Eop7/yKun/861sf/VwLz/3MvI/+PW0//q4d3/8evn//j08P/9+/f////8////////////AP///////////////////v/+/Pn/+vbz//bv6//x6OP/7N/Z/+bVz//gy8T/2sG6/9S3r//Prqb/yqef/8ehmf/Fnpf/xJ6X/8Whm//HpqL/y66q/9G4tP/Xwr//3s3K/+XY1f/s49//8+zo//n18f/+/Pj////9////////////AP///////////////////v/+/fn/+/fz//fw7P/y6OP/7eDa/+fW0P/hzMb/28K7/9a5sf/RsKj/zKmh/8mjnP/HoJn/xqCa/8ejnv/JqaT/zbCs/9K6tv/YxMD/38/L/+bZ1v/t4+D/8+3p//n18f/+/Pj////+////////////HCU4UCaYN3YAAAAASUVORK5CYII=",
+    placeHolderURL: blurhashDataUri,
     src: "https://picsum.photos/seed/example/300/200",
     srcSet: "https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x"
-  });
-};
-ImageLazyLoadSrcSetPlaceHolderURL.displayName = "ImageLazyLoadSrcSetPlaceHolderURL";
-ImageLazyLoadSrcSetPlaceHolderURL.story = {
-  name: "Image + lazyLoad + srcSet + placeHolderURL"
+  }
 };
 var StyledImage = (0, _styledComponents.default)(_Image.Image).withConfig({
   displayName: "Imagestory__StyledImage",
   componentId: "sc-1wz2m45-0"
 })(["width:100%;height:100%;"]);
-var WithStyledImage = exports.WithStyledImage = function WithStyledImage() {
-  return /*#__PURE__*/_react.default.createElement(_Box.Box, {
-    width: 400,
-    height: 400,
-    bg: "red"
-  }, /*#__PURE__*/_react.default.createElement(StyledImage, {
-    placeHolderURL: blurhashDataUri,
-    src: "https://picsum.photos/seed/example/300/200",
-    srcSet: "https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x"
-  }));
+var WithStyledImage = exports.WithStyledImage = {
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(_Box.Box, {
+      width: 400,
+      height: 400,
+      bg: "red"
+    }, /*#__PURE__*/_react.default.createElement(StyledImage, {
+      placeHolderURL: blurhashDataUri,
+      src: "https://picsum.photos/seed/example/300/200",
+      srcSet: "https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x"
+    }));
+  }
 };
-WithStyledImage.displayName = "WithStyledImage";
-var WithCustomStyle = exports.WithCustomStyle = function WithCustomStyle() {
-  return /*#__PURE__*/_react.default.createElement(_Box.Box, {
-    width: 400,
-    height: 400,
-    bg: "red"
-  }, /*#__PURE__*/_react.default.createElement(_Image.Image, {
-    width: "100%",
-    height: "100%",
-    src: "https://picsum.photos/seed/example/300/200",
-    style: {
-      borderRadius: "10px",
-      borderColor: "blue",
-      borderWidth: "10px",
-      borderStyle: "solid"
-    }
-  }));
+var WithCustomStyle = exports.WithCustomStyle = {
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(_Box.Box, {
+      width: 400,
+      height: 400,
+      bg: "red"
+    }, /*#__PURE__*/_react.default.createElement(_Image.Image, {
+      width: "100%",
+      height: "100%",
+      src: "https://picsum.photos/seed/example/300/200",
+      style: {
+        borderRadius: "10px",
+        borderColor: "blue",
+        borderWidth: "10px",
+        borderStyle: "solid"
+      }
+    }));
+  }
 };
-WithCustomStyle.displayName = "WithCustomStyle";
-var EnsuresImageDoesNotCollapse = exports.EnsuresImageDoesNotCollapse = function EnsuresImageDoesNotCollapse() {
-  return /*#__PURE__*/_react.default.createElement(_Box.Box, {
-    width: 300,
-    height: 200,
-    bg: "red"
-  }, /*#__PURE__*/_react.default.createElement(_Image.Image, {
-    src: "https://picsum.photos/seed/example/300/200",
-    lazyLoad: true
-  }));
+var EnsuresImageDoesNotCollapse = exports.EnsuresImageDoesNotCollapse = {
+  render: function render() {
+    return /*#__PURE__*/_react.default.createElement(_Box.Box, {
+      width: 300,
+      height: 200,
+      bg: "red"
+    }, /*#__PURE__*/_react.default.createElement(_Image.Image, {
+      src: "https://picsum.photos/seed/example/300/200",
+      lazyLoad: true
+    }));
+  }
 };
-EnsuresImageDoesNotCollapse.displayName = "EnsuresImageDoesNotCollapse";
 //# sourceMappingURL=Image.story.js.map

package/dist/elements/Image/Image.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"Image.story.js","names":["_react","_interopRequireDefault","require","_Image","_styledComponents","_Box","_storybookStates","obj","__esModule","default","blurhashDataUri","_default","exports","title","Default","createElement","States","states","src","srcSet","placeHolderURL","Image","id","className","width","height","displayName","story","name","ImageLazyLoad","Fragment","Array","from","map","_","i","key","lazyLoad","concat","ImageLazyLoadSrcSet","ImageLazyLoadSrcSetPlaceHolderURL","StyledImage","styled","withConfig","componentId","WithStyledImage","Box","bg","WithCustomStyle","style","borderRadius","borderColor","borderWidth","borderStyle","EnsuresImageDoesNotCollapse"],"sources":["../../../src/elements/Image/Image.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { Image } from \"../Image\"\nimport styled from \"styled-components\"\nimport { Box } from \"../Box\"\nimport { States } from \"storybook-states\"\n\nconst blurhashDataUri =\n  \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAQK0lEQVR4AQEgEN/vAP////////////////////////z//vr3//r18f/17ur/7+fi/+ng2v/j2NH/3c/J/9fHwf/SwLn/zbmz/8m0rv/Hsav/xrCr/8eyrf/KtrH/zru3/9PDv//Zy8j/4NTR/+fd2v/u5+P/9O/r//r38////fn////+////////////AP////////////////////////v//vr2//n08P/07un/7+fi/+nf2f/j19H/3c/I/9fHwP/Rv7j/zLmy/8m0rf/Hsar/xrCq/8exrP/JtbD/zbu3/9LCvv/Zysf/39TQ/+bd2v/t5uP/9O/r//r28v///fn////+////////////AP///////////////////////vv//fn2//n08P/07en/7ubh/+je2P/i1s//283H/9XFvv/Qvbb/y7ew/8exq//Frqj/xK2o/8Wvqv/Hsq7/y7i1/9HAvf/XycX/3tLP/+Xc2P/t5eL/8+7q//r28v///fj////+////////////AP///////////////////v///fr//Pn1//jz7v/z7Of/7eXf/+fd1v/g1M3/2cvE/9PDu//NurP/yLOs/8Sup//BqqT/wamj/8Grpv/Er6r/yLWx/869uv/VxsP/3NDN/+Ta1//r5OD/8u3p//n18f/+/Pf////9////////////AP///////////////////v///Pn/+/f0//bx7f/x6uX/6+Pd/+Xa1P/e0cr/18jA/9C/t//Ktq7/xK+n/8Cpof+9pZ7/vKOe/72loP/AqaX/xLCs/8q4tf/Rwr//2c3K/+HX1P/p4d7/8evn//f07//9+/b////8////////////AP///////////////////f/++/j/+vby//Xw6//v6OP/6eDa/+LX0P/bzsb/08S8/8y6sv/Fsaj/v6mg/7uimv+3npf/tpyW/7eemf+6op7/v6qm/8WzsP/Nvbv/1cnG/97U0f/m39v/7unl//by7v/8+vX////7////////////AP/////////////////++//8+fb/+PTw//Pu6f/t5uD/5t3X/9/Uzf/XysL/z7+2/8i1q//Aq6H/uqGY/7Sakf+xlY3/r5ON/7CVkP+0mpb/uaKf/8Csqv/IuLb/0cTB/9rQzf/k3Nj/7Obj//Tw7P/7+PP////6/////v//////AP/////////////+//78+v/6+PX/9vLu//Hr5//q497/49rT/9zQyP/Uxbz/y7qw/8OvpP+6o5n/s5mP/62Rh/+pi4L/qImC/6iLhv+skI3/spmX/7qlo//Dsa//zL+9/9bMyf/g2NX/6uTg//Lu6v/59/L///74/////f//////AP////////////78//z6+f/59vP/9PDs/+7p5P/o4dr/4NfQ/9jMxP/Pwbf/xrSq/72onP+0m4//rJCE/6WGe/+hf3b/n3x1/6B/ef+khYL/qo+N/7Ocm/+9qqn/x7m3/9LHxf/d1dL/5+Hd//Ds5//49fD//vz3/////P//////AP///////v7//fz7//v59//39PH/8u7q/+zm4f/l3tf/3dTM/9XIv//LvLH/wa6i/7ehk/+uk4X/pYV4/516bf+Ycmf/lm5m/5dxa/+beXb/ooWD/6uTkv+2o6L/wrOy/87CwP/Z0c7/5N7a/+7q5f/28+7//Pv1////+v////7/AP7+/v/9/f3//Pv6//n39v/18vD/8Ozo/+rk3//j29T/2tDI/9HEuv/Ht6v/vaib/7KZiv+niXr/nXpq/5VtXf+PYlX/jF5U/41hW/+Sa2j/mnl4/6SJif+wm5v/va2s/8q9vP/Wzcr/4dvY/+zo4//08uz/+/r0////+f////z/APz8/f/8/Pz/+vn5//f29f/z8e7/7urm/+ji3P/g2NH/2M3E/87Atf/DsqX/uKKU/6ySgf+hgG7/lm5b/4xeSv+FUT//gks+/4NPSP+IW1n/kWxs/52AgP+qlJT/uKem/8a5uP/Tysf/39nV/+rm4f/z8Ov/+vny////+P////v/APv7/P/7+/v/+fj4//b08//y7+3/7Ojl/+bg2v/e1s7/1crB/8u8sf/AraD/tJ2N/6eKeP+bd2L/j2JL/4ROM/98PB7/eTQc/3o5MP+ASkj/iWBg/5Z2eP+kjI3/s6Gh/8K1tP/QxsT/3dbT/+jk3//y7+n/+fjx///+9/////v/APr6+//6+vr/+Pf3//Xz8v/w7uz/6+fj/+Te2P/c1Mz/08e+/8i5rf+9qZv/sJiH/6OEcP+Wblb/iVc4/309B/90IQD/cAgA/3EaAP94Nzb/g1NV/5BucP+ghof/r52d/7+xsP/OxMH/29TR/+fi3f/w7uj/+Pfw//7+9v////r/APn6+//5+fr/9/f3//Tz8v/v7ev/6ubi/+Pd1//b0sr/0cW7/8a3qv+7ppf/rpSB/6B/af+SZ0z/hEwj/3cqAP9uAAD/aQAA/2oAAP9xIR//fUhL/4xmaf+cgYP/rZma/72urv/Mwr//2dPP/+Xh3P/w7ef/+Pfw//799v////n/APn5+v/4+Pn/9vb2//Py8f/v7Or/6eXh/+Lc1v/a0cn/0MS6/8W1qP+5pJT/rJF+/557Y/+PYkP/gUMC/3QUAP9qAAD/ZQAA/2YAAP9tAAD/ej9D/4lhZP+afYD/q5aX/7utrP/LwL7/2dLO/+Xg2//v7ef/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eTh/+Lb1f/Z0Mj/0MO5/8W0p/+4o5P/q497/515YP+OXz7/gD4A/3MAAP9oAAD/YwAA/2QAAP9sAAD/eTo+/4heYv+ZfH7/qpWW/7usq//KwL7/2NHO/+Xg2//v7Ob/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eXh/+Lb1f/a0Mj/0MO5/8W0p/+5opL/rI97/554YP+PXj3/gT4A/3QAAP9qAAD/ZQAA/2YAAP9tAAD/ejs//4lfYv+afH7/q5aW/7usq//KwL7/2NHO/+Xg2//v7eb/9/bv//399f////n/APn6+//4+fr/9vb3//Py8f/v7Or/6eXh/+Lc1v/a0cn/0cO5/8a0qP+6o5T/rZB9/596Y/+RYUL/hEIA/3cSAP9uAAD/aQAA/2oAAP9yBwP/fUFE/4xjZv+cf4H/rJeY/7ytrf/Mwb//2dLP/+Xh3P/v7ef/+Pfw//399v////n/APn6+//5+vr/9/f3//Tz8v/w7ev/6ubi/+Pd1//b0sr/0sW7/8i2qv+8pZb/sJKA/6N9Z/+VZkr/iEof/30oAP90AAD/cAAA/3EAAP94JiP/g0tN/5Bpa/+gg4T/r5qb/7+wr//Nw8D/29TQ/+bi3f/w7uj/+Pfw//7+9v////r/APr7/P/5+vv/+Pj4//X08//w7uz/6+fj/+Xe2P/d08z/1Me9/8q4rP+/qJr/s5aF/6eCbv+abFT/jlQ1/4Q6AP98HwD/eQsA/3oeBP+AOzj/ilZX/5Zwcv+kiIn/s5+f/8Kzsv/QxcP/3NXS/+jj3v/x7+n/+fjx//7+9/////v/APv8/f/6/Pz/+fn5//b19P/y8O3/7ejl/+bg2v/f1c7/1snA/827sP/Cq57/t5qL/6yIdv+gdF//lV9H/4xLLv+FOhn/gjMa/4M7Mf+ITUr/kWNi/515ev+qj4//uKSj/8W3tf/TyMb/39jU/+nl4P/y8Or/+vny////+P////v/APz+/v/7/f3/+vr6//f39f/z8e//7urm/+jh3P/h19D/2cvD/9C+tP/Gr6P/vJ+R/7GOfv+mfGr/nWtX/5RaRv+PTjv/jEo8/41PSP+SXVr/mm9u/6SCgv+wlpb/vamo/8m7uf/Wy8n/4drW/+vn4v/08ez/+/r0////+f////z/AP3////9/v7/+/z7//j49v/18/D/8Ozo/+rj3v/k2tP/3M7G/9PCuP/KtKj/wKWY/7eVhv+thXX/pHVl/51oWP+YX1D/llxR/5dgWv+ba2j/onp5/6uLi/+2nZz/wq+u/86/vf/Zz8z/5N3Z/+3p5P/18+7//Pv1////+v////3/AP7////+/////P38//r6+P/29PL/8u7q/+zm4f/m3Nb/39HJ/9fFvP/OuK3/xaqe/7ybjv+0jX//rIBy/6V0Z/+hbWH/n2ti/6Bvaf+keHT/qoWD/7OUk/+9pKP/x7Wz/9LEwv/d0tD/5uDc/+/r5v/39e///fz2////+///////AP///////////v/9//v7+f/49vP/9PDs/+7o4//o39n/4tTN/9rJwP/SvLL/yq+k/8Kilv+6lYn/s4l9/61/dP+peW//qHhw/6l8dv+shID/so+M/7qdm//Dq6n/zLq4/9bIxv/g1tP/6eLf//Ht6f/49vH//v34/////f//////AP/////////////+//39+v/5+PX/9fHu//Dq5f/r4dv/5NfQ/93MxP/WwLf/zrSq/8eonf/AnJH/uZGG/7SJf/+xhHv/sIN8/7GGgf+0jon/uZiV/8Ckov/Isq//0b+9/9rNyv/j2db/7OXh//Pv6//6+PP///75/////v//////AP////////////////7++//7+fb/9/Pv//Ls5//t497/59nT/+DPyP/ZxLz/0riv/8uto//Fopj/v5iP/7qRiP+3jYX/toyF/7ePiv+6lpL/v5+c/8WrqP/Nt7T/1cTB/97Qzf/m3Nn/7ufj//Xx7f/7+fT////6////////////AP///////////////////P/8+vf/+PTx//Tt6f/v5eD/6dzW/+PSy//cx7//1by0/8+xqP/Jp57/xJ6W/8CYj/+9lIz/vJSN/72Xkf/AnZj/xKai/8qwrf/RvLn/2cjF/+HU0P/o39v/8Onl//fy7v/8+vb////8////////////AP///////////////////f/9+/j/+vby//Xv6v/w5uH/693Y/+XUzf/eycL/2L+3/9K1rf/Mq6P/yKOb/8Sdlf/BmpL/wZqT/8Kdl//Eop7/yKun/861sf/VwLz/3MvI/+PW0//q4d3/8evn//j08P/9+/f////8////////////AP///////////////////v/+/Pn/+vbz//bv6//x6OP/7N/Z/+bVz//gy8T/2sG6/9S3r//Prqb/yqef/8ehmf/Fnpf/xJ6X/8Whm//HpqL/y66q/9G4tP/Xwr//3s3K/+XY1f/s49//8+zo//n18f/+/Pj////9////////////AP///////////////////v/+/fn/+/fz//fw7P/y6OP/7eDa/+fW0P/hzMb/28K7/9a5sf/RsKj/zKmh/8mjnP/HoJn/xqCa/8ejnv/JqaT/zbCs/9K6tv/YxMD/38/L/+bZ1v/t4+D/8+3p//n18f/+/Pj////+////////////HCU4UCaYN3YAAAAASUVORK5CYII=\"\n\nexport default {\n  title: \"Components/Image\",\n}\n\nexport const Default = () => {\n  return (\n    <States\n      states={[\n        {},\n        {\n          src: \"https://picsum.photos/seed/example/300/200\",\n          srcSet:\n            \"https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x\",\n        },\n        {\n          placeHolderURL: blurhashDataUri,\n        },\n      ]}\n    >\n      <Image\n        id=\"example\"\n        className=\"example\"\n        width=\"300px\"\n        height=\"200px\"\n        src=\"https://picsum.photos/seed/example/300/200\"\n      />\n    </States>\n  )\n}\n\nDefault.story = {\n  name: \"Image\",\n}\n\nexport const ImageLazyLoad = () => {\n  return (\n    <>\n      {Array.from(Array(100)).map((_, i) => (\n        <Image\n          key={i}\n          lazyLoad\n          width=\"300px\"\n          height=\"200px\"\n          src={`https://picsum.photos/seed/${i}/300/200`}\n        />\n      ))}\n    </>\n  )\n}\n\nImageLazyLoad.story = {\n  name: \"Image + lazyLoad\",\n}\n\nexport const ImageLazyLoadSrcSet = () => {\n  return (\n    <>\n      {Array.from(Array(100)).map((_, i) => (\n        <Image\n          key={i}\n          lazyLoad\n          width=\"300px\"\n          height=\"200px\"\n          src={`https://picsum.photos/seed/${i}/300/200`}\n          srcSet={`https://picsum.photos/seed/${i}/300/200 1x, https://picsum.photos/seed/${i}/600/400 2x`}\n        />\n      ))}\n    </>\n  )\n}\n\nImageLazyLoadSrcSet.story = {\n  name: \"Image + lazyLoad + srcSet\",\n}\n\nexport const ImageLazyLoadSrcSetPlaceHolderURL = () => {\n  return (\n    <Image\n      lazyLoad\n      width=\"300px\"\n      height=\"200px\"\n      placeHolderURL=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAQK0lEQVR4AQEgEN/vAP////////////////////////z//vr3//r18f/17ur/7+fi/+ng2v/j2NH/3c/J/9fHwf/SwLn/zbmz/8m0rv/Hsav/xrCr/8eyrf/KtrH/zru3/9PDv//Zy8j/4NTR/+fd2v/u5+P/9O/r//r38////fn////+////////////AP////////////////////////v//vr2//n08P/07un/7+fi/+nf2f/j19H/3c/I/9fHwP/Rv7j/zLmy/8m0rf/Hsar/xrCq/8exrP/JtbD/zbu3/9LCvv/Zysf/39TQ/+bd2v/t5uP/9O/r//r28v///fn////+////////////AP///////////////////////vv//fn2//n08P/07en/7ubh/+je2P/i1s//283H/9XFvv/Qvbb/y7ew/8exq//Frqj/xK2o/8Wvqv/Hsq7/y7i1/9HAvf/XycX/3tLP/+Xc2P/t5eL/8+7q//r28v///fj////+////////////AP///////////////////v///fr//Pn1//jz7v/z7Of/7eXf/+fd1v/g1M3/2cvE/9PDu//NurP/yLOs/8Sup//BqqT/wamj/8Grpv/Er6r/yLWx/869uv/VxsP/3NDN/+Ta1//r5OD/8u3p//n18f/+/Pf////9////////////AP///////////////////v///Pn/+/f0//bx7f/x6uX/6+Pd/+Xa1P/e0cr/18jA/9C/t//Ktq7/xK+n/8Cpof+9pZ7/vKOe/72loP/AqaX/xLCs/8q4tf/Rwr//2c3K/+HX1P/p4d7/8evn//f07//9+/b////8////////////AP///////////////////f/++/j/+vby//Xw6//v6OP/6eDa/+LX0P/bzsb/08S8/8y6sv/Fsaj/v6mg/7uimv+3npf/tpyW/7eemf+6op7/v6qm/8WzsP/Nvbv/1cnG/97U0f/m39v/7unl//by7v/8+vX////7////////////AP/////////////////++//8+fb/+PTw//Pu6f/t5uD/5t3X/9/Uzf/XysL/z7+2/8i1q//Aq6H/uqGY/7Sakf+xlY3/r5ON/7CVkP+0mpb/uaKf/8Csqv/IuLb/0cTB/9rQzf/k3Nj/7Obj//Tw7P/7+PP////6/////v//////AP/////////////+//78+v/6+PX/9vLu//Hr5//q497/49rT/9zQyP/Uxbz/y7qw/8OvpP+6o5n/s5mP/62Rh/+pi4L/qImC/6iLhv+skI3/spmX/7qlo//Dsa//zL+9/9bMyf/g2NX/6uTg//Lu6v/59/L///74/////f//////AP////////////78//z6+f/59vP/9PDs/+7p5P/o4dr/4NfQ/9jMxP/Pwbf/xrSq/72onP+0m4//rJCE/6WGe/+hf3b/n3x1/6B/ef+khYL/qo+N/7Ocm/+9qqn/x7m3/9LHxf/d1dL/5+Hd//Ds5//49fD//vz3/////P//////AP///////v7//fz7//v59//39PH/8u7q/+zm4f/l3tf/3dTM/9XIv//LvLH/wa6i/7ehk/+uk4X/pYV4/516bf+Ycmf/lm5m/5dxa/+beXb/ooWD/6uTkv+2o6L/wrOy/87CwP/Z0c7/5N7a/+7q5f/28+7//Pv1////+v////7/AP7+/v/9/f3//Pv6//n39v/18vD/8Ozo/+rk3//j29T/2tDI/9HEuv/Ht6v/vaib/7KZiv+niXr/nXpq/5VtXf+PYlX/jF5U/41hW/+Sa2j/mnl4/6SJif+wm5v/va2s/8q9vP/Wzcr/4dvY/+zo4//08uz/+/r0////+f////z/APz8/f/8/Pz/+vn5//f29f/z8e7/7urm/+ji3P/g2NH/2M3E/87Atf/DsqX/uKKU/6ySgf+hgG7/lm5b/4xeSv+FUT//gks+/4NPSP+IW1n/kWxs/52AgP+qlJT/uKem/8a5uP/Tysf/39nV/+rm4f/z8Ov/+vny////+P////v/APv7/P/7+/v/+fj4//b08//y7+3/7Ojl/+bg2v/e1s7/1crB/8u8sf/AraD/tJ2N/6eKeP+bd2L/j2JL/4ROM/98PB7/eTQc/3o5MP+ASkj/iWBg/5Z2eP+kjI3/s6Gh/8K1tP/QxsT/3dbT/+jk3//y7+n/+fjx///+9/////v/APr6+//6+vr/+Pf3//Xz8v/w7uz/6+fj/+Te2P/c1Mz/08e+/8i5rf+9qZv/sJiH/6OEcP+Wblb/iVc4/309B/90IQD/cAgA/3EaAP94Nzb/g1NV/5BucP+ghof/r52d/7+xsP/OxMH/29TR/+fi3f/w7uj/+Pfw//7+9v////r/APn6+//5+fr/9/f3//Tz8v/v7ev/6ubi/+Pd1//b0sr/0cW7/8a3qv+7ppf/rpSB/6B/af+SZ0z/hEwj/3cqAP9uAAD/aQAA/2oAAP9xIR//fUhL/4xmaf+cgYP/rZma/72urv/Mwr//2dPP/+Xh3P/w7ef/+Pfw//799v////n/APn5+v/4+Pn/9vb2//Py8f/v7Or/6eXh/+Lc1v/a0cn/0MS6/8W1qP+5pJT/rJF+/557Y/+PYkP/gUMC/3QUAP9qAAD/ZQAA/2YAAP9tAAD/ej9D/4lhZP+afYD/q5aX/7utrP/LwL7/2dLO/+Xg2//v7ef/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eTh/+Lb1f/Z0Mj/0MO5/8W0p/+4o5P/q497/515YP+OXz7/gD4A/3MAAP9oAAD/YwAA/2QAAP9sAAD/eTo+/4heYv+ZfH7/qpWW/7usq//KwL7/2NHO/+Xg2//v7Ob/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eXh/+Lb1f/a0Mj/0MO5/8W0p/+5opL/rI97/554YP+PXj3/gT4A/3QAAP9qAAD/ZQAA/2YAAP9tAAD/ejs//4lfYv+afH7/q5aW/7usq//KwL7/2NHO/+Xg2//v7eb/9/bv//399f////n/APn6+//4+fr/9vb3//Py8f/v7Or/6eXh/+Lc1v/a0cn/0cO5/8a0qP+6o5T/rZB9/596Y/+RYUL/hEIA/3cSAP9uAAD/aQAA/2oAAP9yBwP/fUFE/4xjZv+cf4H/rJeY/7ytrf/Mwb//2dLP/+Xh3P/v7ef/+Pfw//399v////n/APn6+//5+vr/9/f3//Tz8v/w7ev/6ubi/+Pd1//b0sr/0sW7/8i2qv+8pZb/sJKA/6N9Z/+VZkr/iEof/30oAP90AAD/cAAA/3EAAP94JiP/g0tN/5Bpa/+gg4T/r5qb/7+wr//Nw8D/29TQ/+bi3f/w7uj/+Pfw//7+9v////r/APr7/P/5+vv/+Pj4//X08//w7uz/6+fj/+Xe2P/d08z/1Me9/8q4rP+/qJr/s5aF/6eCbv+abFT/jlQ1/4Q6AP98HwD/eQsA/3oeBP+AOzj/ilZX/5Zwcv+kiIn/s5+f/8Kzsv/QxcP/3NXS/+jj3v/x7+n/+fjx//7+9/////v/APv8/f/6/Pz/+fn5//b19P/y8O3/7ejl/+bg2v/f1c7/1snA/827sP/Cq57/t5qL/6yIdv+gdF//lV9H/4xLLv+FOhn/gjMa/4M7Mf+ITUr/kWNi/515ev+qj4//uKSj/8W3tf/TyMb/39jU/+nl4P/y8Or/+vny////+P////v/APz+/v/7/f3/+vr6//f39f/z8e//7urm/+jh3P/h19D/2cvD/9C+tP/Gr6P/vJ+R/7GOfv+mfGr/nWtX/5RaRv+PTjv/jEo8/41PSP+SXVr/mm9u/6SCgv+wlpb/vamo/8m7uf/Wy8n/4drW/+vn4v/08ez/+/r0////+f////z/AP3////9/v7/+/z7//j49v/18/D/8Ozo/+rj3v/k2tP/3M7G/9PCuP/KtKj/wKWY/7eVhv+thXX/pHVl/51oWP+YX1D/llxR/5dgWv+ba2j/onp5/6uLi/+2nZz/wq+u/86/vf/Zz8z/5N3Z/+3p5P/18+7//Pv1////+v////3/AP7////+/////P38//r6+P/29PL/8u7q/+zm4f/m3Nb/39HJ/9fFvP/OuK3/xaqe/7ybjv+0jX//rIBy/6V0Z/+hbWH/n2ti/6Bvaf+keHT/qoWD/7OUk/+9pKP/x7Wz/9LEwv/d0tD/5uDc/+/r5v/39e///fz2////+///////AP///////////v/9//v7+f/49vP/9PDs/+7o4//o39n/4tTN/9rJwP/SvLL/yq+k/8Kilv+6lYn/s4l9/61/dP+peW//qHhw/6l8dv+shID/so+M/7qdm//Dq6n/zLq4/9bIxv/g1tP/6eLf//Ht6f/49vH//v34/////f//////AP/////////////+//39+v/5+PX/9fHu//Dq5f/r4dv/5NfQ/93MxP/WwLf/zrSq/8eonf/AnJH/uZGG/7SJf/+xhHv/sIN8/7GGgf+0jon/uZiV/8Ckov/Isq//0b+9/9rNyv/j2db/7OXh//Pv6//6+PP///75/////v//////AP////////////////7++//7+fb/9/Pv//Ls5//t497/59nT/+DPyP/ZxLz/0riv/8uto//Fopj/v5iP/7qRiP+3jYX/toyF/7ePiv+6lpL/v5+c/8WrqP/Nt7T/1cTB/97Qzf/m3Nn/7ufj//Xx7f/7+fT////6////////////AP///////////////////P/8+vf/+PTx//Tt6f/v5eD/6dzW/+PSy//cx7//1by0/8+xqP/Jp57/xJ6W/8CYj/+9lIz/vJSN/72Xkf/AnZj/xKai/8qwrf/RvLn/2cjF/+HU0P/o39v/8Onl//fy7v/8+vb////8////////////AP///////////////////f/9+/j/+vby//Xv6v/w5uH/693Y/+XUzf/eycL/2L+3/9K1rf/Mq6P/yKOb/8Sdlf/BmpL/wZqT/8Kdl//Eop7/yKun/861sf/VwLz/3MvI/+PW0//q4d3/8evn//j08P/9+/f////8////////////AP///////////////////v/+/Pn/+vbz//bv6//x6OP/7N/Z/+bVz//gy8T/2sG6/9S3r//Prqb/yqef/8ehmf/Fnpf/xJ6X/8Whm//HpqL/y66q/9G4tP/Xwr//3s3K/+XY1f/s49//8+zo//n18f/+/Pj////9////////////AP///////////////////v/+/fn/+/fz//fw7P/y6OP/7eDa/+fW0P/hzMb/28K7/9a5sf/RsKj/zKmh/8mjnP/HoJn/xqCa/8ejnv/JqaT/zbCs/9K6tv/YxMD/38/L/+bZ1v/t4+D/8+3p//n18f/+/Pj////+////////////HCU4UCaYN3YAAAAASUVORK5CYII=\"\n      src=\"https://picsum.photos/seed/example/300/200\"\n      srcSet=\"https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x\"\n    />\n  )\n}\n\nImageLazyLoadSrcSetPlaceHolderURL.story = {\n  name: \"Image + lazyLoad + srcSet + placeHolderURL\",\n}\n\nconst StyledImage = styled(Image)`\n  width: 100%;\n  height: 100%;\n`\n\nexport const WithStyledImage = () => {\n  return (\n    <Box width={400} height={400} bg=\"red\">\n      <StyledImage\n        placeHolderURL={blurhashDataUri}\n        src=\"https://picsum.photos/seed/example/300/200\"\n        srcSet=\"https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x\"\n      />\n    </Box>\n  )\n}\n\nexport const WithCustomStyle = () => {\n  return (\n    <Box width={400} height={400} bg=\"red\">\n      <Image\n        width=\"100%\"\n        height=\"100%\"\n        src=\"https://picsum.photos/seed/example/300/200\"\n        style={{\n          borderRadius: \"10px\",\n          borderColor: \"blue\",\n          borderWidth: \"10px\",\n          borderStyle: \"solid\",\n        }}\n      />\n    </Box>\n  )\n}\n\nexport const EnsuresImageDoesNotCollapse = () => {\n  return (\n    <Box width={300} height={200} bg=\"red\">\n      <Image src=\"https://picsum.photos/seed/example/300/200\" lazyLoad />\n    </Box>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Image.story.js","names":["_react","_interopRequireDefault","require","_Image","_styledComponents","_Box","_storybookBlocklist","obj","__esModule","default","blurhashDataUri","_default","exports","component","Image","title","tags","parameters","docs","description","controls","exclude","STORYBOOK_PROPS_BLOCKLIST","Default","args","id","className","width","height","src","WithSrcSet","srcSet","WithPlaceholder","placeHolderURL","ImageLazyLoad","render","createElement","Fragment","Array","from","map","_","i","key","lazyLoad","concat","ImageLazyLoadSrcSet","ImageLazyLoadSrcSetPlaceHolderURL","StyledImage","styled","withConfig","displayName","componentId","WithStyledImage","Box","bg","WithCustomStyle","style","borderRadius","borderColor","borderWidth","borderStyle","EnsuresImageDoesNotCollapse"],"sources":["../../../src/elements/Image/Image.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { Image } from \"../Image\"\nimport styled from \"styled-components\"\nimport { Box } from \"../Box\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nconst blurhashDataUri =\n  \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAQK0lEQVR4AQEgEN/vAP////////////////////////z//vr3//r18f/17ur/7+fi/+ng2v/j2NH/3c/J/9fHwf/SwLn/zbmz/8m0rv/Hsav/xrCr/8eyrf/KtrH/zru3/9PDv//Zy8j/4NTR/+fd2v/u5+P/9O/r//r38////fn////+////////////AP////////////////////////v//vr2//n08P/07un/7+fi/+nf2f/j19H/3c/I/9fHwP/Rv7j/zLmy/8m0rf/Hsar/xrCq/8exrP/JtbD/zbu3/9LCvv/Zysf/39TQ/+bd2v/t5uP/9O/r//r28v///fn////+////////////AP///////////////////////vv//fn2//n08P/07en/7ubh/+je2P/i1s//283H/9XFvv/Qvbb/y7ew/8exq//Frqj/xK2o/8Wvqv/Hsq7/y7i1/9HAvf/XycX/3tLP/+Xc2P/t5eL/8+7q//r28v///fj////+////////////AP///////////////////v///fr//Pn1//jz7v/z7Of/7eXf/+fd1v/g1M3/2cvE/9PDu//NurP/yLOs/8Sup//BqqT/wamj/8Grpv/Er6r/yLWx/869uv/VxsP/3NDN/+Ta1//r5OD/8u3p//n18f/+/Pf////9////////////AP///////////////////v///Pn/+/f0//bx7f/x6uX/6+Pd/+Xa1P/e0cr/18jA/9C/t//Ktq7/xK+n/8Cpof+9pZ7/vKOe/72loP/AqaX/xLCs/8q4tf/Rwr//2c3K/+HX1P/p4d7/8evn//f07//9+/b////8////////////AP///////////////////f/++/j/+vby//Xw6//v6OP/6eDa/+LX0P/bzsb/08S8/8y6sv/Fsaj/v6mg/7uimv+3npf/tpyW/7eemf+6op7/v6qm/8WzsP/Nvbv/1cnG/97U0f/m39v/7unl//by7v/8+vX////7////////////AP/////////////////++//8+fb/+PTw//Pu6f/t5uD/5t3X/9/Uzf/XysL/z7+2/8i1q//Aq6H/uqGY/7Sakf+xlY3/r5ON/7CVkP+0mpb/uaKf/8Csqv/IuLb/0cTB/9rQzf/k3Nj/7Obj//Tw7P/7+PP////6/////v//////AP/////////////+//78+v/6+PX/9vLu//Hr5//q497/49rT/9zQyP/Uxbz/y7qw/8OvpP+6o5n/s5mP/62Rh/+pi4L/qImC/6iLhv+skI3/spmX/7qlo//Dsa//zL+9/9bMyf/g2NX/6uTg//Lu6v/59/L///74/////f//////AP////////////78//z6+f/59vP/9PDs/+7p5P/o4dr/4NfQ/9jMxP/Pwbf/xrSq/72onP+0m4//rJCE/6WGe/+hf3b/n3x1/6B/ef+khYL/qo+N/7Ocm/+9qqn/x7m3/9LHxf/d1dL/5+Hd//Ds5//49fD//vz3/////P//////AP///////v7//fz7//v59//39PH/8u7q/+zm4f/l3tf/3dTM/9XIv//LvLH/wa6i/7ehk/+uk4X/pYV4/516bf+Ycmf/lm5m/5dxa/+beXb/ooWD/6uTkv+2o6L/wrOy/87CwP/Z0c7/5N7a/+7q5f/28+7//Pv1////+v////7/AP7+/v/9/f3//Pv6//n39v/18vD/8Ozo/+rk3//j29T/2tDI/9HEuv/Ht6v/vaib/7KZiv+niXr/nXpq/5VtXf+PYlX/jF5U/41hW/+Sa2j/mnl4/6SJif+wm5v/va2s/8q9vP/Wzcr/4dvY/+zo4//08uz/+/r0////+f////z/APz8/f/8/Pz/+vn5//f29f/z8e7/7urm/+ji3P/g2NH/2M3E/87Atf/DsqX/uKKU/6ySgf+hgG7/lm5b/4xeSv+FUT//gks+/4NPSP+IW1n/kWxs/52AgP+qlJT/uKem/8a5uP/Tysf/39nV/+rm4f/z8Ov/+vny////+P////v/APv7/P/7+/v/+fj4//b08//y7+3/7Ojl/+bg2v/e1s7/1crB/8u8sf/AraD/tJ2N/6eKeP+bd2L/j2JL/4ROM/98PB7/eTQc/3o5MP+ASkj/iWBg/5Z2eP+kjI3/s6Gh/8K1tP/QxsT/3dbT/+jk3//y7+n/+fjx///+9/////v/APr6+//6+vr/+Pf3//Xz8v/w7uz/6+fj/+Te2P/c1Mz/08e+/8i5rf+9qZv/sJiH/6OEcP+Wblb/iVc4/309B/90IQD/cAgA/3EaAP94Nzb/g1NV/5BucP+ghof/r52d/7+xsP/OxMH/29TR/+fi3f/w7uj/+Pfw//7+9v////r/APn6+//5+fr/9/f3//Tz8v/v7ev/6ubi/+Pd1//b0sr/0cW7/8a3qv+7ppf/rpSB/6B/af+SZ0z/hEwj/3cqAP9uAAD/aQAA/2oAAP9xIR//fUhL/4xmaf+cgYP/rZma/72urv/Mwr//2dPP/+Xh3P/w7ef/+Pfw//799v////n/APn5+v/4+Pn/9vb2//Py8f/v7Or/6eXh/+Lc1v/a0cn/0MS6/8W1qP+5pJT/rJF+/557Y/+PYkP/gUMC/3QUAP9qAAD/ZQAA/2YAAP9tAAD/ej9D/4lhZP+afYD/q5aX/7utrP/LwL7/2dLO/+Xg2//v7ef/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eTh/+Lb1f/Z0Mj/0MO5/8W0p/+4o5P/q497/515YP+OXz7/gD4A/3MAAP9oAAD/YwAA/2QAAP9sAAD/eTo+/4heYv+ZfH7/qpWW/7usq//KwL7/2NHO/+Xg2//v7Ob/9/bv//399f////n/APj5+v/4+Pn/9vb2//Py8f/u7Or/6eXh/+Lb1f/a0Mj/0MO5/8W0p/+5opL/rI97/554YP+PXj3/gT4A/3QAAP9qAAD/ZQAA/2YAAP9tAAD/ejs//4lfYv+afH7/q5aW/7usq//KwL7/2NHO/+Xg2//v7eb/9/bv//399f////n/APn6+//4+fr/9vb3//Py8f/v7Or/6eXh/+Lc1v/a0cn/0cO5/8a0qP+6o5T/rZB9/596Y/+RYUL/hEIA/3cSAP9uAAD/aQAA/2oAAP9yBwP/fUFE/4xjZv+cf4H/rJeY/7ytrf/Mwb//2dLP/+Xh3P/v7ef/+Pfw//399v////n/APn6+//5+vr/9/f3//Tz8v/w7ev/6ubi/+Pd1//b0sr/0sW7/8i2qv+8pZb/sJKA/6N9Z/+VZkr/iEof/30oAP90AAD/cAAA/3EAAP94JiP/g0tN/5Bpa/+gg4T/r5qb/7+wr//Nw8D/29TQ/+bi3f/w7uj/+Pfw//7+9v////r/APr7/P/5+vv/+Pj4//X08//w7uz/6+fj/+Xe2P/d08z/1Me9/8q4rP+/qJr/s5aF/6eCbv+abFT/jlQ1/4Q6AP98HwD/eQsA/3oeBP+AOzj/ilZX/5Zwcv+kiIn/s5+f/8Kzsv/QxcP/3NXS/+jj3v/x7+n/+fjx//7+9/////v/APv8/f/6/Pz/+fn5//b19P/y8O3/7ejl/+bg2v/f1c7/1snA/827sP/Cq57/t5qL/6yIdv+gdF//lV9H/4xLLv+FOhn/gjMa/4M7Mf+ITUr/kWNi/515ev+qj4//uKSj/8W3tf/TyMb/39jU/+nl4P/y8Or/+vny////+P////v/APz+/v/7/f3/+vr6//f39f/z8e//7urm/+jh3P/h19D/2cvD/9C+tP/Gr6P/vJ+R/7GOfv+mfGr/nWtX/5RaRv+PTjv/jEo8/41PSP+SXVr/mm9u/6SCgv+wlpb/vamo/8m7uf/Wy8n/4drW/+vn4v/08ez/+/r0////+f////z/AP3////9/v7/+/z7//j49v/18/D/8Ozo/+rj3v/k2tP/3M7G/9PCuP/KtKj/wKWY/7eVhv+thXX/pHVl/51oWP+YX1D/llxR/5dgWv+ba2j/onp5/6uLi/+2nZz/wq+u/86/vf/Zz8z/5N3Z/+3p5P/18+7//Pv1////+v////3/AP7////+/////P38//r6+P/29PL/8u7q/+zm4f/m3Nb/39HJ/9fFvP/OuK3/xaqe/7ybjv+0jX//rIBy/6V0Z/+hbWH/n2ti/6Bvaf+keHT/qoWD/7OUk/+9pKP/x7Wz/9LEwv/d0tD/5uDc/+/r5v/39e///fz2////+///////AP///////////v/9//v7+f/49vP/9PDs/+7o4//o39n/4tTN/9rJwP/SvLL/yq+k/8Kilv+6lYn/s4l9/61/dP+peW//qHhw/6l8dv+shID/so+M/7qdm//Dq6n/zLq4/9bIxv/g1tP/6eLf//Ht6f/49vH//v34/////f//////AP/////////////+//39+v/5+PX/9fHu//Dq5f/r4dv/5NfQ/93MxP/WwLf/zrSq/8eonf/AnJH/uZGG/7SJf/+xhHv/sIN8/7GGgf+0jon/uZiV/8Ckov/Isq//0b+9/9rNyv/j2db/7OXh//Pv6//6+PP///75/////v//////AP////////////////7++//7+fb/9/Pv//Ls5//t497/59nT/+DPyP/ZxLz/0riv/8uto//Fopj/v5iP/7qRiP+3jYX/toyF/7ePiv+6lpL/v5+c/8WrqP/Nt7T/1cTB/97Qzf/m3Nn/7ufj//Xx7f/7+fT////6////////////AP///////////////////P/8+vf/+PTx//Tt6f/v5eD/6dzW/+PSy//cx7//1by0/8+xqP/Jp57/xJ6W/8CYj/+9lIz/vJSN/72Xkf/AnZj/xKai/8qwrf/RvLn/2cjF/+HU0P/o39v/8Onl//fy7v/8+vb////8////////////AP///////////////////f/9+/j/+vby//Xv6v/w5uH/693Y/+XUzf/eycL/2L+3/9K1rf/Mq6P/yKOb/8Sdlf/BmpL/wZqT/8Kdl//Eop7/yKun/861sf/VwLz/3MvI/+PW0//q4d3/8evn//j08P/9+/f////8////////////AP///////////////////v/+/Pn/+vbz//bv6//x6OP/7N/Z/+bVz//gy8T/2sG6/9S3r//Prqb/yqef/8ehmf/Fnpf/xJ6X/8Whm//HpqL/y66q/9G4tP/Xwr//3s3K/+XY1f/s49//8+zo//n18f/+/Pj////9////////////AP///////////////////v/+/fn/+/fz//fw7P/y6OP/7eDa/+fW0P/hzMb/28K7/9a5sf/RsKj/zKmh/8mjnP/HoJn/xqCa/8ejnv/JqaT/zbCs/9K6tv/YxMD/38/L/+bZ1v/t4+D/8+3p//n18f/+/Pj////+////////////HCU4UCaYN3YAAAAASUVORK5CYII=\"\n\nexport default {\n  component: Image,\n  title: \"Components/Image\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"An optimized image component with support for lazy loading, srcSet, and placeholder images.\",\n      },\n    },\n    controls: {\n      exclude: STORYBOOK_PROPS_BLOCKLIST,\n    },\n  },\n}\n\nexport const Default = {\n  args: {\n    id: \"example\",\n    className: \"example\",\n    width: \"300px\",\n    height: \"200px\",\n    src: \"https://picsum.photos/seed/example/300/200\",\n  },\n}\n\nexport const WithSrcSet = {\n  args: {\n    id: \"example\",\n    className: \"example\",\n    width: \"300px\",\n    height: \"200px\",\n    src: \"https://picsum.photos/seed/example/300/200\",\n    srcSet:\n      \"https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x\",\n  },\n}\n\nexport const WithPlaceholder = {\n  args: {\n    id: \"example\",\n    className: \"example\",\n    width: \"300px\",\n    height: \"200px\",\n    src: \"https://picsum.photos/seed/example/300/200\",\n    placeHolderURL: blurhashDataUri,\n  },\n}\n\nexport const ImageLazyLoad = {\n  render: () => {\n    return (\n      <>\n        {Array.from(Array(100)).map((_, i) => (\n          <Image\n            key={i}\n            lazyLoad\n            width=\"300px\"\n            height=\"200px\"\n            src={`https://picsum.photos/seed/${i}/300/200`}\n          />\n        ))}\n      </>\n    )\n  },\n}\n\nexport const ImageLazyLoadSrcSet = {\n  render: () => {\n    return (\n      <>\n        {Array.from(Array(100)).map((_, i) => (\n          <Image\n            key={i}\n            lazyLoad\n            width=\"300px\"\n            height=\"200px\"\n            src={`https://picsum.photos/seed/${i}/300/200`}\n            srcSet={`https://picsum.photos/seed/${i}/300/200 1x, https://picsum.photos/seed/${i}/600/400 2x`}\n          />\n        ))}\n      </>\n    )\n  },\n}\n\nexport const ImageLazyLoadSrcSetPlaceHolderURL = {\n  args: {\n    lazyLoad: true,\n    width: \"300px\",\n    height: \"200px\",\n    placeHolderURL: blurhashDataUri,\n    src: \"https://picsum.photos/seed/example/300/200\",\n    srcSet:\n      \"https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x\",\n  },\n}\n\nconst StyledImage = styled(Image)`\n  width: 100%;\n  height: 100%;\n`\n\nexport const WithStyledImage = {\n  render: () => {\n    return (\n      <Box width={400} height={400} bg=\"red\">\n        <StyledImage\n          placeHolderURL={blurhashDataUri}\n          src=\"https://picsum.photos/seed/example/300/200\"\n          srcSet=\"https://picsum.photos/seed/example/300/200 1x, https://picsum.photos/seed/example/600/400 2x\"\n        />\n      </Box>\n    )\n  },\n}\n\nexport const WithCustomStyle = {\n  render: () => {\n    return (\n      <Box width={400} height={400} bg=\"red\">\n        <Image\n          width=\"100%\"\n          height=\"100%\"\n          src=\"https://picsum.photos/seed/example/300/200\"\n          style={{\n            borderRadius: \"10px\",\n            borderColor: \"blue\",\n            borderWidth: \"10px\",\n            borderStyle: \"solid\",\n          }}\n        />\n      </Box>\n    )\n  },\n}\n\nexport const EnsuresImageDoesNotCollapse = {\n  render: () => {\n    return (\n      <Box width={300} height={200} bg=\"red\">\n        <Image src=\"https://picsum.photos/seed/example/300/200\" lazyLoad />\n      </Box>\n    )\n  },\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,IAAA,GAAAH,OAAA;AACA,IAAAI,mBAAA,GAAAJ,OAAA;AAA0E,SAAAD,uBAAAM,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAE1E,IAAMG,eAAe,GACnB,o/KAAo/K;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAAH,OAAA,GAEv+K;EACbI,SAAS,EAAEC,YAAK;EAChBC,KAAK,EAAE,kBAAkB;EACzBC,IAAI,EAAE,CAAC,UAAU,CAAC;EAClBC,UAAU,EAAE;IACVC,IAAI,EAAE;MACJC,WAAW,EAAE;QACXN,SAAS,EACP;MACJ;IACF,CAAC;IACDO,QAAQ,EAAE;MACRC,OAAO,EAAEC;IACX;EACF;AACF,CAAC;AAEM,IAAMC,OAAO,GAAAX,OAAA,CAAAW,OAAA,GAAG;EACrBC,IAAI,EAAE;IACJC,EAAE,EAAE,SAAS;IACbC,SAAS,EAAE,SAAS;IACpBC,KAAK,EAAE,OAAO;IACdC,MAAM,EAAE,OAAO;IACfC,GAAG,EAAE;EACP;AACF,CAAC;AAEM,IAAMC,UAAU,GAAAlB,OAAA,CAAAkB,UAAA,GAAG;EACxBN,IAAI,EAAE;IACJC,EAAE,EAAE,SAAS;IACbC,SAAS,EAAE,SAAS;IACpBC,KAAK,EAAE,OAAO;IACdC,MAAM,EAAE,OAAO;IACfC,GAAG,EAAE,4CAA4C;IACjDE,MAAM,EACJ;EACJ;AACF,CAAC;AAEM,IAAMC,eAAe,GAAApB,OAAA,CAAAoB,eAAA,GAAG;EAC7BR,IAAI,EAAE;IACJC,EAAE,EAAE,SAAS;IACbC,SAAS,EAAE,SAAS;IACpBC,KAAK,EAAE,OAAO;IACdC,MAAM,EAAE,OAAO;IACfC,GAAG,EAAE,4CAA4C;IACjDI,cAAc,EAAEvB;EAClB;AACF,CAAC;AAEM,IAAMwB,aAAa,GAAAtB,OAAA,CAAAsB,aAAA,GAAG;EAC3BC,MAAM,EAAE,SAARA,MAAMA,CAAA,EAAQ;IACZ,oBACEnC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAApC,MAAA,CAAAS,OAAA,CAAA4B,QAAA,QACGC,KAAK,CAACC,IAAI,CAACD,KAAK,CAAC,GAAG,CAAC,CAAC,CAACE,GAAG,CAAC,UAACC,CAAC,EAAEC,CAAC;MAAA,oBAC/B1C,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAACjC,MAAA,CAAAW,KAAK;QACJ6B,GAAG,EAAED,CAAE;QACPE,QAAQ;QACRjB,KAAK,EAAC,OAAO;QACbC,MAAM,EAAC,OAAO;QACdC,GAAG,gCAAAgB,MAAA,CAAgCH,CAAC;MAAW,EAC/C;IAAA,CACH,CAAC,CACD;EAEP;AACF,CAAC;AAEM,IAAMI,mBAAmB,GAAAlC,OAAA,CAAAkC,mBAAA,GAAG;EACjCX,MAAM,EAAE,SAARA,MAAMA,CAAA,EAAQ;IACZ,oBACEnC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAApC,MAAA,CAAAS,OAAA,CAAA4B,QAAA,QACGC,KAAK,CAACC,IAAI,CAACD,KAAK,CAAC,GAAG,CAAC,CAAC,CAACE,GAAG,CAAC,UAACC,CAAC,EAAEC,CAAC;MAAA,oBAC/B1C,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAACjC,MAAA,CAAAW,KAAK;QACJ6B,GAAG,EAAED,CAAE;QACPE,QAAQ;QACRjB,KAAK,EAAC,OAAO;QACbC,MAAM,EAAC,OAAO;QACdC,GAAG,gCAAAgB,MAAA,CAAgCH,CAAC,aAAW;QAC/CX,MAAM,gCAAAc,MAAA,CAAgCH,CAAC,8CAAAG,MAAA,CAA2CH,CAAC;MAAc,EACjG;IAAA,CACH,CAAC,CACD;EAEP;AACF,CAAC;AAEM,IAAMK,iCAAiC,GAAAnC,OAAA,CAAAmC,iCAAA,GAAG;EAC/CvB,IAAI,EAAE;IACJoB,QAAQ,EAAE,IAAI;IACdjB,KAAK,EAAE,OAAO;IACdC,MAAM,EAAE,OAAO;IACfK,cAAc,EAAEvB,eAAe;IAC/BmB,GAAG,EAAE,4CAA4C;IACjDE,MAAM,EACJ;EACJ;AACF,CAAC;AAED,IAAMiB,WAAW,GAAG,IAAAC,yBAAM,EAACnC,YAAK,CAAC,CAAAoC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,+BAGhC;AAEM,IAAMC,eAAe,GAAAzC,OAAA,CAAAyC,eAAA,GAAG;EAC7BlB,MAAM,EAAE,SAARA,MAAMA,CAAA,EAAQ;IACZ,oBACEnC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAC/B,IAAA,CAAAiD,GAAG;MAAC3B,KAAK,EAAE,GAAI;MAACC,MAAM,EAAE,GAAI;MAAC2B,EAAE,EAAC;IAAK,gBACpCvD,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAACY,WAAW;MACVf,cAAc,EAAEvB,eAAgB;MAChCmB,GAAG,EAAC,4CAA4C;MAChDE,MAAM,EAAC;IAA8F,EACrG,CACE;EAEV;AACF,CAAC;AAEM,IAAMyB,eAAe,GAAA5C,OAAA,CAAA4C,eAAA,GAAG;EAC7BrB,MAAM,EAAE,SAARA,MAAMA,CAAA,EAAQ;IACZ,oBACEnC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAC/B,IAAA,CAAAiD,GAAG;MAAC3B,KAAK,EAAE,GAAI;MAACC,MAAM,EAAE,GAAI;MAAC2B,EAAE,EAAC;IAAK,gBACpCvD,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAACjC,MAAA,CAAAW,KAAK;MACJa,KAAK,EAAC,MAAM;MACZC,MAAM,EAAC,MAAM;MACbC,GAAG,EAAC,4CAA4C;MAChD4B,KAAK,EAAE;QACLC,YAAY,EAAE,MAAM;QACpBC,WAAW,EAAE,MAAM;QACnBC,WAAW,EAAE,MAAM;QACnBC,WAAW,EAAE;MACf;IAAE,EACF,CACE;EAEV;AACF,CAAC;AAEM,IAAMC,2BAA2B,GAAAlD,OAAA,CAAAkD,2BAAA,GAAG;EACzC3B,MAAM,EAAE,SAARA,MAAMA,CAAA,EAAQ;IACZ,oBACEnC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAC/B,IAAA,CAAAiD,GAAG;MAAC3B,KAAK,EAAE,GAAI;MAACC,MAAM,EAAE,GAAI;MAAC2B,EAAE,EAAC;IAAK,gBACpCvD,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAACjC,MAAA,CAAAW,KAAK;MAACe,GAAG,EAAC,4CAA4C;MAACe,QAAQ;IAAA,EAAG,CAC/D;EAEV;AACF,CAAC"}

package/dist/elements/Input/Input.story.d.ts

@@ -1,10 +1,115 @@
-import React from "react";
 declare const _default: {
     title: string;
+    component: import("react").ForwardRefExoticComponent<import("./Input").InputProps & import("react").RefAttributes<HTMLInputElement>>;
+    tags: string[];
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+            controls: {
+                exclude: string[];
+            };
+        };
+    };
 };
 export default _default;
-export declare const Default: () => React.JSX.Element;
-export declare const Styled: () => React.JSX.Element;
-export declare const Required: () => React.JSX.Element;
-export declare const WithState: () => React.JSX.Element;
-export declare const CustomHeight: () => React.JSX.Element;
+export declare const Basic: {
+    args: {
+        placeholder: string;
+    };
+};
+export declare const WithTitle: {
+    args: {
+        title: string;
+        placeholder: string;
+    };
+};
+export declare const RequiredField: {
+    args: {
+        title: string;
+        required: boolean;
+        placeholder: string;
+    };
+};
+export declare const WithError: {
+    args: {
+        title: string;
+        error: string;
+        value: string;
+    };
+};
+export declare const Disabled: {
+    args: {
+        title: string;
+        disabled: boolean;
+        value: string;
+    };
+};
+export declare const WithMaxLength: {
+    args: {
+        title: string;
+        maxLength: number;
+        placeholder: string;
+    };
+};
+export declare const WithDescription: {
+    args: {
+        title: string;
+        description: string;
+        placeholder: string;
+    };
+};
+export declare const WithCounter: {
+    args: {
+        title: string;
+        required: boolean;
+        maxLength: number;
+        showCounter: boolean;
+        placeholder: string;
+    };
+};
+export declare const LongTitle: {
+    args: {
+        title: string;
+        placeholder: string;
+    };
+};
+export declare const CustomWidth: {
+    args: {
+        width: string;
+        placeholder: string;
+    };
+};
+export declare const EmailInput: {
+    args: {
+        title: string;
+        type: string;
+        required: boolean;
+        placeholder: string;
+    };
+};
+export declare const CustomHeight: {
+    args: {
+        height: number;
+        placeholder: string;
+    };
+};
+export declare const FocusState: {
+    args: {
+        focus: boolean;
+        placeholder: string;
+    };
+};
+export declare const HoverState: {
+    args: {
+        hover: boolean;
+        placeholder: string;
+    };
+};
+export declare const ActiveState: {
+    args: {
+        active: boolean;
+        placeholder: string;
+    };
+};