@salutejs/plasma-new-hope 0.384.0-dev.0 → 0.385.0-dev.0

package/dist/styled-components/cjs/plasmaCore/components/Card/CardMedia.js

@@ -0,0 +1,89 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "CardMedia", {
+    enumerable: true,
+    get: function() {
+        return CardMedia;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard(require("styled-components"));
+const _Image = require("../Image");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const StyledImage = (0, _styledcomponents.default)(_Image.Image).withConfig({
+    displayName: "CardMedia__StyledImage",
+    componentId: "sc-636df49e-0"
+})([
+    `background-size:cover;`,
+    ``
+], ({ $disabled })=>$disabled && (0, _styledcomponents.css)([
+        `opacity:0.5;`
+    ]));
+const StyledRoot = _styledcomponents.default.div.withConfig({
+    displayName: "CardMedia__StyledRoot",
+    componentId: "sc-636df49e-1"
+})([
+    `position:relative;`
+]);
+const CardMedia = ({ disabled, placeholder, style, children, className, ...props })=>{
+    const imgStyle = {
+        ...style
+    };
+    if (placeholder && !props.src) {
+        imgStyle.backgroundImage = `url('${placeholder}')`;
+    }
+    return /*#__PURE__*/ _react.default.createElement(StyledRoot, {
+        className: className
+    }, /*#__PURE__*/ _react.default.createElement(StyledImage, {
+        $disabled: disabled,
+        style: imgStyle,
+        ...props
+    }), children);
+};

package/dist/styled-components/cjs/plasmaCore/components/Card/CardPrice.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "CardPrice", {
+    enumerable: true,
+    get: function() {
+        return CardPrice;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _styledcomponents = /*#__PURE__*/ _interop_require_default(require("styled-components"));
+const _tokens = require("../../utils/tokens");
+const _Price = require("../Price");
+const _Typography = require("../Typography");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const StyledRoot = (0, _styledcomponents.default)(_Typography.Body2).withConfig({
+    displayName: "CardPrice__StyledRoot",
+    componentId: "sc-d49f8b89-0"
+})([
+    `display:flex;box-sizing:border-box;margin-top:0.75rem;`
+]);
+const StyledPrice = (0, _styledcomponents.default)(_Price.Price).withConfig({
+    displayName: "CardPrice__StyledPrice",
+    componentId: "sc-d49f8b89-1"
+})([
+    `height:2.5rem;color:`,
+    `;`
+], _tokens.primary);
+const StyledOldPrice = (0, _styledcomponents.default)(_Price.Price).withConfig({
+    displayName: "CardPrice__StyledOldPrice",
+    componentId: "sc-d49f8b89-2"
+})([
+    `height:2.5rem;margin-left:0.5rem;color:`,
+    `;`
+], _tokens.tertiary);
+const StyledCount = (0, _styledcomponents.default)(_Typography.Body2).withConfig({
+    displayName: "CardPrice__StyledCount",
+    componentId: "sc-d49f8b89-3"
+})([
+    `box-sizing:border-box;height:2.5rem;margin-left:0.5rem;color:`,
+    `;`
+], _tokens.buttonAccent);
+const CardPrice = ({ count, currency, oldPrice, price, ...rest })=>{
+    return /*#__PURE__*/ _react.default.createElement(StyledRoot, rest, /*#__PURE__*/ _react.default.createElement(StyledPrice, {
+        currency: currency
+    }, price), oldPrice && /*#__PURE__*/ _react.default.createElement(StyledOldPrice, {
+        currency: currency,
+        stroke: true
+    }, oldPrice), count ? /*#__PURE__*/ _react.default.createElement(StyledCount, null, "×", count) : '');
+};

package/dist/styled-components/cjs/plasmaCore/components/Card/CardTypography.js

@@ -0,0 +1,165 @@
+/* stylelint-disable */ // TODO:
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get CardBody1 () {
+        return CardBody1;
+    },
+    get CardBody2 () {
+        return CardBody2;
+    },
+    get CardFootnote1 () {
+        return CardFootnote1;
+    },
+    get CardFootnote2 () {
+        return CardFootnote2;
+    },
+    get CardHeadline1 () {
+        return CardHeadline1;
+    },
+    get CardHeadline2 () {
+        return CardHeadline2;
+    },
+    get CardHeadline3 () {
+        return CardHeadline3;
+    },
+    get CardParagraph1 () {
+        return CardParagraph1;
+    },
+    get CardParagraph2 () {
+        return CardParagraph2;
+    }
+});
+const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard(require("styled-components"));
+const _tokens = require("../../utils/tokens");
+const _Typography = require("../Typography");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const views = {
+    primary: _tokens.primary,
+    secondary: _tokens.secondary,
+    tertiary: _tokens.tertiary
+};
+const linesMixin = ({ lines = 2 })=>(0, _styledcomponents.css)([
+        `display:-webkit-box;overflow:hidden;box-sizing:border-box;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:`,
+        `;`
+    ], lines);
+const viewMixin = ({ view = 'primary' })=>(0, _styledcomponents.css)([
+        `transition:`,
+        `;color:`,
+        `;`
+    ], ({ theme })=>theme.lowPerformance ? 'unset' : 'color 0.1s ease-in-out', views[view]);
+const CardHeadline1 = (0, _styledcomponents.default)(_Typography.Headline1).withConfig({
+    displayName: "CardTypography__CardHeadline1",
+    componentId: "sc-a0a01f21-0"
+})([
+    ``,
+    `;`
+], viewMixin);
+const CardHeadline2 = (0, _styledcomponents.default)(_Typography.Headline2).withConfig({
+    displayName: "CardTypography__CardHeadline2",
+    componentId: "sc-a0a01f21-1"
+})([
+    ``,
+    `;`
+], viewMixin);
+const CardHeadline3 = (0, _styledcomponents.default)(_Typography.Headline3).withConfig({
+    displayName: "CardTypography__CardHeadline3",
+    componentId: "sc-a0a01f21-2"
+})([
+    ``,
+    `;`
+], viewMixin);
+const CardFootnote1 = (0, _styledcomponents.default)(_Typography.Footnote1).withConfig({
+    displayName: "CardTypography__CardFootnote1",
+    componentId: "sc-a0a01f21-3"
+})([
+    ``,
+    `;`
+], viewMixin);
+const CardFootnote2 = (0, _styledcomponents.default)(_Typography.Footnote2).withConfig({
+    displayName: "CardTypography__CardFootnote2",
+    componentId: "sc-a0a01f21-4"
+})([
+    ``,
+    `;`
+], viewMixin);
+const CardBody1 = (0, _styledcomponents.default)(_Typography.Body1).withConfig({
+    displayName: "CardTypography__CardBody1",
+    componentId: "sc-a0a01f21-5"
+})([
+    ``,
+    `;`,
+    `;`
+], linesMixin, viewMixin);
+const CardBody2 = (0, _styledcomponents.default)(_Typography.Body2).withConfig({
+    displayName: "CardTypography__CardBody2",
+    componentId: "sc-a0a01f21-6"
+})([
+    ``,
+    `;`,
+    `;`
+], linesMixin, viewMixin);
+const CardParagraph1 = (0, _styledcomponents.default)(_Typography.ParagraphText1).withConfig({
+    displayName: "CardTypography__CardParagraph1",
+    componentId: "sc-a0a01f21-7"
+})([
+    ``,
+    `;`,
+    `;`
+], linesMixin, viewMixin);
+const CardParagraph2 = (0, _styledcomponents.default)(_Typography.ParagraphText2).withConfig({
+    displayName: "CardTypography__CardParagraph2",
+    componentId: "sc-a0a01f21-8"
+})([
+    ``,
+    `;`,
+    `;`
+], linesMixin, viewMixin);

package/dist/styled-components/cjs/plasmaCore/components/Card/index.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get Card () {
+        return _Card.Card;
+    },
+    get CardBody () {
+        return _CardBody.CardBody;
+    },
+    get CardContent () {
+        return _CardContent.CardContent;
+    },
+    get CardMedia () {
+        return _CardMedia.CardMedia;
+    },
+    get CardPrice () {
+        return _CardPrice.CardPrice;
+    },
+    get StyledCard () {
+        return _Card.StyledCard;
+    }
+});
+const _Card = require("./Card");
+const _CardBody = require("./CardBody");
+const _CardContent = require("./CardContent");
+const _CardMedia = require("./CardMedia");
+const _CardPrice = require("./CardPrice");
+_export_star(require("./CardTypography"), exports);
+function _export_star(from, to) {
+    Object.keys(from).forEach(function(k) {
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
+    });
+    return from;
+}

package/dist/styled-components/cjs/plasmaCore/components/Field/Field.js

@@ -0,0 +1,128 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get FieldContent () {
+        return FieldContent;
+    },
+    get FieldHelper () {
+        return FieldHelper;
+    },
+    get FieldPlaceholder () {
+        return FieldPlaceholder;
+    },
+    get FieldRoot () {
+        return FieldRoot;
+    }
+});
+const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard(require("styled-components"));
+const _mixins = require("../../utils/mixins");
+const _tokens = require("../../utils/tokens");
+const _Fieldstatuses = require("./Field.statuses");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const FieldPlaceholder = _styledcomponents.default.label.withConfig({
+    displayName: "Field__FieldPlaceholder",
+    componentId: "sc-a0ceaa40-0"
+})([
+    `position:absolute;top:0;left:0;box-sizing:border-box;width:100%;height:100%;color:`,
+    `;pointer-events:none;transition:`,
+    `;transform-origin:top left;`,
+    ``
+], _tokens.tertiary, ({ theme })=>theme.lowPerformance ? 'unset' : 'all 0.1s ease-in', _mixins.applyEllipsis);
+const FieldContent = _styledcomponents.default.div.withConfig({
+    displayName: "Field__FieldContent",
+    componentId: "sc-a0ceaa40-1"
+})([
+    `position:absolute;top:0;`,
+    `;bottom:0;display:flex;align-items:center;height:3rem;`
+], ({ pos })=>pos === 'left' ? 'left: 1rem' : 'right: 1rem');
+const FieldHelper = _styledcomponents.default.span.withConfig({
+    displayName: "Field__FieldHelper",
+    componentId: "sc-a0ceaa40-2"
+})([
+    ``,
+    `;display:block;margin-top:0.25rem;`,
+    ``
+], _tokens.caption, _mixins.applyEllipsis);
+const FieldRoot = _styledcomponents.default.div.withConfig({
+    displayName: "Field__FieldRoot",
+    componentId: "sc-a0ceaa40-3"
+})([
+    ``,
+    `;position:relative;display:block;box-sizing:border-box;color:`,
+    `;`,
+    ` `,
+    ` `,
+    ` `,
+    ``
+], _tokens.body1, _tokens.secondary, _mixins.applyDisabled, ({ $size = 'm' })=>$size === 'l' ? (0, _styledcomponents.css)([
+        ``,
+        `{top:1.125rem;left:1rem;right:1rem;}input:not(:placeholder-shown) ~ `,
+        `{transform:scale(0.75);top:0.375rem;}`,
+        `{height:3.5rem;}`
+    ], FieldPlaceholder, FieldPlaceholder, FieldContent) : (0, _styledcomponents.css)([
+        ``,
+        `{height:3rem;}`
+    ], FieldContent), ({ $isContentLeft, $isContentRight })=>(0, _styledcomponents.css)([
+        `input,textarea{`,
+        `  `,
+        `}`,
+        `{`,
+        `  `,
+        `}`
+    ], $isContentLeft && 'padding-left: 3.125rem;', $isContentRight && 'padding-right: 3.125rem;', FieldPlaceholder, $isContentLeft && 'left: 3.125rem;', $isContentRight && 'right: 3.125rem;'), ({ $isHelper, status })=>status && ($isHelper ? (0, _styledcomponents.css)([
+        ``,
+        `{color:`,
+        `;}`
+    ], FieldHelper, _Fieldstatuses.fieldStatuses[status]) : (0, _styledcomponents.css)([
+        ``,
+        `{color:`,
+        `;}`
+    ], FieldPlaceholder, _Fieldstatuses.fieldStatuses[status])));

package/dist/styled-components/cjs/plasmaCore/components/Field/Field.statuses.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get fieldBackgroundStatuses () {
+        return fieldBackgroundStatuses;
+    },
+    get fieldStatuses () {
+        return fieldStatuses;
+    }
+});
+const _tokens = require("../../utils/tokens");
+const fieldStatuses = {
+    success: _tokens.success,
+    warning: _tokens.warning,
+    error: _tokens.critical
+};
+const fieldBackgroundStatuses = {
+    success: _tokens.buttonSuccess,
+    warning: _tokens.buttonWarning,
+    error: _tokens.buttonCritical
+};

package/dist/styled-components/cjs/plasmaCore/components/Field/index.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get FieldContent () {
+        return _Field.FieldContent;
+    },
+    get FieldHelper () {
+        return _Field.FieldHelper;
+    },
+    get FieldPlaceholder () {
+        return _Field.FieldPlaceholder;
+    },
+    get FieldRoot () {
+        return _Field.FieldRoot;
+    },
+    get fieldBackgroundStatuses () {
+        return _Fieldstatuses.fieldBackgroundStatuses;
+    },
+    get fieldStatuses () {
+        return _Fieldstatuses.fieldStatuses;
+    }
+});
+const _Field = require("./Field");
+const _Fieldstatuses = require("./Field.statuses");

package/dist/styled-components/cjs/plasmaCore/components/Image/Image.js

@@ -0,0 +1,136 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Image", {
+    enumerable: true,
+    get: function() {
+        return Image;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard(require("styled-components"));
+const _utils = require("../../utils/utils");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const ratios = {
+    '1 / 1': '100',
+    '1/1': '100',
+    '3 / 4': '133.3333',
+    '3/4': '133.3333',
+    '4 / 3': '75',
+    '4/3': '75',
+    '9 / 16': '177.7778',
+    '9/16': '177.7778',
+    '16 / 9': '56.25',
+    '16/9': '56.25',
+    '1 / 2': '200',
+    '1/2': '200',
+    '2 / 1': '50',
+    '2/1': '50'
+};
+const StyledRoot = _styledcomponents.default.div.withConfig({
+    displayName: "Image__StyledRoot",
+    componentId: "sc-9972793a-0"
+})([
+    `position:relative;display:block;box-sizing:border-box;overflow:hidden;width:100%;height:inherit;border-radius:inherit;`,
+    ` `,
+    ``
+], ({ $ratio, $customRatio })=>($ratio || $customRatio) && (0, _styledcomponents.css)([
+        `height:0;padding-bottom:`,
+        `%;`
+    ], $ratio ? ratios[$ratio] : $customRatio), ({ $width, $height })=>(0, _styledcomponents.css)([
+        ``,
+        ` `,
+        ``
+    ], $width && `width: ${(0, _utils.toCssSize)($width)};`, $height && `height: ${(0, _utils.toCssSize)($height)};`));
+const StyledImg = _styledcomponents.default.img.withConfig({
+    displayName: "Image__StyledImg",
+    componentId: "sc-9972793a-1"
+})([
+    `width:100%;`,
+    `;`
+], ({ src, ratio })=>src && ratio && (0, _styledcomponents.css)([
+        `height:100%;object-fit:cover;position:absolute;`
+    ]));
+const StyledDivImg = _styledcomponents.default.div.withConfig({
+    displayName: "Image__StyledDivImg",
+    componentId: "sc-9972793a-2"
+})([
+    `width:100%;height:100%;position:absolute;background-position:center;background-size:cover;`
+]);
+/**
+ * Компонент для отображения картинок.
+ */ const ImageBase = ({ src, srcSet, sizes, base = 'img', alt, width, height, ...props })=>{
+    const ratio = 'ratio' in props ? props.ratio : undefined;
+    const customRatio = 'customRatio' in props ? props.customRatio : undefined;
+    return /*#__PURE__*/ _react.default.createElement(StyledRoot, {
+        $ratio: ratio,
+        $customRatio: customRatio,
+        $width: width,
+        $height: height,
+        ...props
+    }, base === 'img' && /*#__PURE__*/ _react.default.createElement(StyledImg, {
+        src: src,
+        srcSet: srcSet,
+        sizes: sizes,
+        alt: alt,
+        ratio: ratio
+    }), base === 'div' && /*#__PURE__*/ _react.default.createElement(StyledDivImg, {
+        style: {
+            backgroundImage: `url(${src})`
+        },
+        role: "img",
+        "aria-label": alt
+    }));
+};
+const Image = (0, _styledcomponents.default)(ImageBase).withConfig({
+    displayName: "Image",
+    componentId: "sc-9972793a-3"
+})([
+    ``
+]);

package/dist/styled-components/cjs/plasmaCore/components/Image/index.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Image", {
+    enumerable: true,
+    get: function() {
+        return _Image.Image;
+    }
+});
+const _Image = require("./Image");