takeat-design-system-ui-kit 0.2.4 → 0.2.5

package/dist/cjs/components/Image/Image.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from "@storybook/react";
+import { Image } from ".";
+declare const meta: Meta<typeof Image>;
+export default meta;
+type Story = StoryObj<typeof Image>;
+export declare const Example: Story;

package/dist/cjs/components/Image/Image.stories.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Example = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var _1 = require(".");
+var styles_1 = require("../StoriesComponents/styles");
+var meta = {
+    title: "Design System/Image",
+    component: _1.Image,
+    parameters: {
+        componentSubtitle: ((0, jsx_runtime_1.jsx)(styles_1.Subtitle, { children: "Componente para renderizar imagens que j\u00E1 possui um placeholder padr\u00E3o." })),
+    },
+    argTypes: {
+        style: {
+            table: {
+                disable: true,
+            },
+        },
+        src: {
+            type: "string",
+        },
+    },
+    args: {
+        src: "https://picsum.photos/200/200",
+    },
+};
+exports.default = meta;
+exports.Example = {
+    name: "Exemplo",
+    args: {
+        style: {
+            width: 200,
+            height: 200,
+            borderRadius: 20,
+            objectFit: "cover",
+            objectPosition: "center",
+        },
+    },
+    render: function (args) {
+        return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(_1.Image, tslib_1.__assign({}, args)) }));
+    },
+};
+//# sourceMappingURL=Image.stories.js.map

package/dist/cjs/components/Image/Image.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.stories.js","sourceRoot":"","sources":["../../../../src/components/Image/Image.stories.tsx"],"names":[],"mappings":";;;;;AACA,sBAA0B;AAC1B,sDAAuD;AAEvD,IAAM,IAAI,GAAuB;IAC/B,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,QAAK;IAChB,UAAU,EAAE;QACV,iBAAiB,EAAE,CACjB,uBAAC,iBAAQ,oGAEE,CACZ;KACF;IACD,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI;aACd;SACF;QACD,GAAG,EAAE;YACH,IAAI,EAAE,QAAQ;SACf;KACF;IACD,IAAI,EAAE;QACJ,GAAG,EAAE,+BAA+B;KACrC;CACF,CAAC;AAEF,kBAAe,IAAI,CAAC;AAIP,QAAA,OAAO,GAAU;IAC5B,IAAI,EAAE,SAAS;IACf,IAAI,EAAE;QACJ,KAAK,EAAE;YACL,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;YACX,YAAY,EAAE,EAAE;YAChB,SAAS,EAAE,OAAO;YAClB,cAAc,EAAE,QAAQ;SACzB;KACF;IACD,MAAM,EAAE,UAAC,IAAI;QACX,OAAO,CACL,0CACE,uBAAC,QAAK,uBAAK,IAAI,EAAI,GACf,CACP,CAAC;IACJ,CAAC;CACF,CAAC"}

package/dist/cjs/components/Image/index.d.ts

@@ -0,0 +1,5 @@
+import React, { ImgHTMLAttributes } from "react";
+interface ImageProps extends ImgHTMLAttributes<HTMLImageElement> {
+}
+export declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLImageElement>>;
+export {};

package/dist/cjs/components/Image/index.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Image = void 0;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styles_1 = require("./styles");
+exports.Image = (0, react_1.forwardRef)(function Image(_a, ref) {
+    var props = tslib_1.__rest(_a, []);
+    var src = props.src;
+    if (src) {
+        return (0, jsx_runtime_1.jsx)("img", tslib_1.__assign({ ref: ref }, props, { src: src }));
+    }
+    return (0, jsx_runtime_1.jsx)(styles_1.PlaceholderContainer, tslib_1.__assign({ ref: ref }, props));
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Image/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Image/index.tsx"],"names":[],"mappings":";;;;;AAAA,+BAA6D;AAE7D,mCAAgD;AAInC,QAAA,KAAK,GAAG,IAAA,kBAAU,EAAC,SAAS,KAAK,CAC5C,EAAwB,EACxB,GAAgC;QAD3B,KAAK,sBAAV,EAAY,CAAF;IAGF,IAAA,GAAG,GAAK,KAAK,IAAV,CAAW;IAEtB,IAAI,GAAG,EAAE,CAAC;QACR,OAAO,iDAAK,GAAG,EAAE,GAAG,IAAM,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAC;IAChD,CAAC;IAED,OAAO,uBAAC,6BAAoB,qBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,EAAI,CAAC;AACvD,CAAC,CAAC,CAAC"}

package/dist/cjs/components/Image/styles.d.ts

@@ -0,0 +1 @@
+export declare const PlaceholderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/cjs/components/Image/styles.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PlaceholderContainer = void 0;
+var tslib_1 = require("tslib");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+var PlaceholderPattern_png_1 = tslib_1.__importDefault(require("../../assets/PlaceholderPattern.png"));
+exports.PlaceholderContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  background-image: url(", ");\n"], ["\n  background-image: url(", ");\n"])), PlaceholderPattern_png_1.default);
+var templateObject_1;
+//# sourceMappingURL=styles.js.map

package/dist/cjs/components/Image/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/components/Image/styles.ts"],"names":[],"mappings":";;;;AAAA,gFAAuC;AACvC,uGAAmE;AAEtD,QAAA,oBAAoB,GAAG,2BAAM,CAAC,GAAG,+GAAA,4BACpB,EAAgB,MACzC,KADyB,gCAAgB,EACxC"}

package/dist/esm/components/Image/Image.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from "@storybook/react";
+import { Image } from ".";
+declare const meta: Meta<typeof Image>;
+export default meta;
+type Story = StoryObj<typeof Image>;
+export declare const Example: Story;

package/dist/esm/components/Image/Image.stories.js

@@ -0,0 +1,41 @@
+import { __assign } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Image } from ".";
+import { Subtitle } from "../StoriesComponents/styles";
+var meta = {
+    title: "Design System/Image",
+    component: Image,
+    parameters: {
+        componentSubtitle: (_jsx(Subtitle, { children: "Componente para renderizar imagens que j\u00E1 possui um placeholder padr\u00E3o." })),
+    },
+    argTypes: {
+        style: {
+            table: {
+                disable: true,
+            },
+        },
+        src: {
+            type: "string",
+        },
+    },
+    args: {
+        src: "https://picsum.photos/200/200",
+    },
+};
+export default meta;
+export var Example = {
+    name: "Exemplo",
+    args: {
+        style: {
+            width: 200,
+            height: 200,
+            borderRadius: 20,
+            objectFit: "cover",
+            objectPosition: "center",
+        },
+    },
+    render: function (args) {
+        return (_jsx("div", { children: _jsx(Image, __assign({}, args)) }));
+    },
+};
+//# sourceMappingURL=Image.stories.js.map

package/dist/esm/components/Image/Image.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.stories.js","sourceRoot":"","sources":["../../../../src/components/Image/Image.stories.tsx"],"names":[],"mappings":";;AACA,OAAO,EAAE,KAAK,EAAE,MAAM,GAAG,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,IAAM,IAAI,GAAuB;IAC/B,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,KAAK;IAChB,UAAU,EAAE;QACV,iBAAiB,EAAE,CACjB,KAAC,QAAQ,oGAEE,CACZ;KACF;IACD,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI;aACd;SACF;QACD,GAAG,EAAE;YACH,IAAI,EAAE,QAAQ;SACf;KACF;IACD,IAAI,EAAE;QACJ,GAAG,EAAE,+BAA+B;KACrC;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,IAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,SAAS;IACf,IAAI,EAAE;QACJ,KAAK,EAAE;YACL,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;YACX,YAAY,EAAE,EAAE;YAChB,SAAS,EAAE,OAAO;YAClB,cAAc,EAAE,QAAQ;SACzB;KACF;IACD,MAAM,EAAE,UAAC,IAAI;QACX,OAAO,CACL,wBACE,KAAC,KAAK,eAAK,IAAI,EAAI,GACf,CACP,CAAC;IACJ,CAAC;CACF,CAAC"}

package/dist/esm/components/Image/index.d.ts

@@ -0,0 +1,5 @@
+import React, { ImgHTMLAttributes } from "react";
+interface ImageProps extends ImgHTMLAttributes<HTMLImageElement> {
+}
+export declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLImageElement>>;
+export {};

package/dist/esm/components/Image/index.js

@@ -0,0 +1,13 @@
+import { __assign, __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { PlaceholderContainer } from "./styles";
+export var Image = forwardRef(function Image(_a, ref) {
+    var props = __rest(_a, []);
+    var src = props.src;
+    if (src) {
+        return _jsx("img", __assign({ ref: ref }, props, { src: src }));
+    }
+    return _jsx(PlaceholderContainer, __assign({ ref: ref }, props));
+});
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Image/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Image/index.tsx"],"names":[],"mappings":";;AAAA,OAAc,EAAE,UAAU,EAAqB,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAIhD,MAAM,CAAC,IAAM,KAAK,GAAG,UAAU,CAAC,SAAS,KAAK,CAC5C,EAAwB,EACxB,GAAgC;QAD3B,KAAK,cAAV,EAAY,CAAF;IAGF,IAAA,GAAG,GAAK,KAAK,IAAV,CAAW;IAEtB,IAAI,GAAG,EAAE,CAAC;QACR,OAAO,uBAAK,GAAG,EAAE,GAAG,IAAM,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAC;IAChD,CAAC;IAED,OAAO,KAAC,oBAAoB,aAAC,GAAG,EAAE,GAAG,IAAM,KAAK,EAAI,CAAC;AACvD,CAAC,CAAC,CAAC"}

package/dist/esm/components/Image/styles.d.ts

@@ -0,0 +1 @@
+export declare const PlaceholderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/esm/components/Image/styles.js

@@ -0,0 +1,6 @@
+import { __makeTemplateObject } from "tslib";
+import styled from "styled-components";
+import placeholderImage from "../../assets/PlaceholderPattern.png";
+export var PlaceholderContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-image: url(", ");\n"], ["\n  background-image: url(", ");\n"])), placeholderImage);
+var templateObject_1;
+//# sourceMappingURL=styles.js.map

package/dist/esm/components/Image/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/components/Image/styles.ts"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,gBAAgB,MAAM,qCAAqC,CAAC;AAEnE,MAAM,CAAC,IAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,uGAAA,4BACpB,EAAgB,MACzC,KADyB,gBAAgB,CACzC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "takeat-design-system-ui-kit",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "type": "module",
   "scripts": {
     "dev": "vite",