@c-rex/components 0.0.8 → 0.0.9

package/dist/stories/blur-image.stories.cjs.js

@@ -0,0 +1,265 @@
+"use strict";
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _non_iterable_rest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _type_of(obj) {
+    "@swc/helpers - typeof";
+    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = function(target, all) {
+    for(var name in all)__defProp(target, name, {
+        get: all[name],
+        enumerable: true
+    });
+};
+var __copyProps = function(to, from, except, desc) {
+    if (from && (typeof from === "undefined" ? "undefined" : _type_of(from)) === "object" || typeof from === "function") {
+        var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
+        try {
+            var _loop = function() {
+                var key = _step.value;
+                if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+                    get: function() {
+                        return from[key];
+                    },
+                    enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+                });
+            };
+            for(var _iterator = __getOwnPropNames(from)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true)_loop();
+        } catch (err) {
+            _didIteratorError = true;
+            _iteratorError = err;
+        } finally{
+            try {
+                if (!_iteratorNormalCompletion && _iterator.return != null) {
+                    _iterator.return();
+                }
+            } finally{
+                if (_didIteratorError) {
+                    throw _iteratorError;
+                }
+            }
+        }
+    }
+    return to;
+};
+var __toESM = function(mod, isNodeMode, target) {
+    return target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(// If the importer is in node compatibility mode or this is not an ESM
+    // file that has been converted to a CommonJS file using a Babel-
+    // compatible transform (i.e. "__esModule" has not been set), then set
+    // "default" to the CommonJS "module.exports" for node compatibility.
+    isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+        value: mod,
+        enumerable: true
+    }) : target, mod);
+};
+var __toCommonJS = function(mod) {
+    return __copyProps(__defProp({}, "__esModule", {
+        value: true
+    }), mod);
+};
+// src/stories/blur-image.stories.tsx
+var blur_image_stories_exports = {};
+__export(blur_image_stories_exports, {
+    Default: function() {
+        return Default;
+    },
+    RoundedImage: function() {
+        return RoundedImage;
+    },
+    SmallImage: function() {
+        return SmallImage;
+    },
+    default: function() {
+        return blur_image_stories_default;
+    }
+});
+module.exports = __toCommonJS(blur_image_stories_exports);
+// src/blur-image.tsx
+var import_react = require("react");
+var import_image = __toESM(require("next/image"), 1);
+// ../utils/src/classMerge.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn() {
+    for(var _len = arguments.length, inputs = new Array(_len), _key = 0; _key < _len; _key++){
+        inputs[_key] = arguments[_key];
+    }
+    return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+// src/blur-image.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var BlurImage = function(props) {
+    var _ref = _sliced_to_array((0, import_react.useState)(true), 2), isLoading = _ref[0], setLoading = _ref[1];
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, _object_spread_props(_object_spread({}, props), {
+        alt: props.alt,
+        className: cn(props.className, "duration-500 ease-in-out", isLoading ? "blur-sm" : "blur-0"),
+        onLoad: function() {
+            return setLoading(false);
+        }
+    }));
+};
+// src/stories/blur-image.stories.tsx
+var meta = {
+    title: "Components/BlurImage",
+    component: BlurImage,
+    tags: [
+        "autodocs"
+    ],
+    parameters: {
+        layout: "centered"
+    },
+    argTypes: {
+        src: {
+            control: "text"
+        },
+        alt: {
+            control: "text"
+        },
+        width: {
+            control: "number"
+        },
+        height: {
+            control: "number"
+        },
+        className: {
+            control: "text"
+        }
+    }
+};
+var blur_image_stories_default = meta;
+var Default = {
+    args: {
+        src: "https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
+        alt: "Sample image with blur effect",
+        width: 400,
+        height: 300,
+        className: "rounded-lg"
+    }
+};
+var SmallImage = {
+    args: {
+        src: "https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
+        alt: "Small sample image with blur effect",
+        width: 200,
+        height: 150,
+        className: "rounded-lg"
+    }
+};
+var RoundedImage = {
+    args: {
+        src: "https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
+        alt: "Rounded sample image with blur effect",
+        width: 300,
+        height: 300,
+        className: "rounded-full"
+    }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+    Default: Default,
+    RoundedImage: RoundedImage,
+    SmallImage: SmallImage
+});
+//# sourceMappingURL=blur-image.stories.cjs.js.map

package/dist/stories/blur-image.stories.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/periotto/Desktop/workspace/c-rex.net-web-client-foundation/packages/components/dist/stories/blur-image.stories.cjs.js","../../src/stories/blur-image.stories.tsx","../../src/blur-image.tsx","../../../utils/src/classMerge.ts"],"names":["__create","Object","create","__defProp","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__getProtoOf","getPrototypeOf","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toESM","mod","isNodeMode","__esModule","value","__toCommonJS","blur_image_stories_exports","Default","RoundedImage","SmallImage","default","blur_image_stories_default","module","exports","import_react","require","import_image","import_clsx","import_tailwind_merge","cn","inputs","twMerge","clsx","import_jsx_runtime","BlurImage","props","useState","isLoading","setLoading","jsx","Image","alt","className","onLoad","meta","title","component","tags","parameters","layout","argTypes","src","control","width","height","args"],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,IAAIA,WAAWC,OAAOC,MAAM;AAC5B,IAAIC,YAAYF,OAAOG,cAAc;AACrC,IAAIC,mBAAmBJ,OAAOK,wBAAwB;AACtD,IAAIC,oBAAoBN,OAAOO,mBAAmB;AAClD,IAAIC,eAAeR,OAAOS,cAAc;AACxC,IAAIC,eAAeV,OAAOW,SAAS,CAACC,cAAc;AAClD,IAAIC,WAAW,SAACC,QAAQC;IACtB,IAAK,IAAIC,QAAQD,IACfb,UAAUY,QAAQE,MAAM;QAAEC,KAAKF,GAAG,CAACC,KAAK;QAAEE,YAAY;IAAK;AAC/D;AACA,IAAIC,cAAc,SAACC,IAAIC,MAAMC,QAAQC;IACnC,IAAIF,QAAQ,CAAA,OAAOA,qCAAP,SAAOA,KAAG,MAAM,YAAY,OAAOA,SAAS,YAAY;YAC7D,kCAAA,2BAAA;;;gBAAA,IAAIG,MAAJ;gBACH,IAAI,CAACd,aAAae,IAAI,CAACL,IAAII,QAAQA,QAAQF,QACzCpB,UAAUkB,IAAII,KAAK;oBAAEP,KAAK;+BAAMI,IAAI,CAACG,IAAI;;oBAAEN,YAAY,CAAEK,CAAAA,OAAOnB,iBAAiBiB,MAAMG,IAAG,KAAMD,KAAKL,UAAU;gBAAC;;YAFpH,QAAK,YAAWZ,kBAAkBe,0BAA7B,SAAA,6BAAA,QAAA,yBAAA;;YAAA;YAAA;;;qBAAA,6BAAA;oBAAA;;;oBAAA;0BAAA;;;;IAGP;IACA,OAAOD;AACT;AACA,IAAIM,UAAU,SAACC,KAAKC,YAAYd;WAAYA,SAASa,OAAO,OAAO5B,SAASS,aAAamB,QAAQ,CAAC,GAAGR,YACnG,sEAAsE;IACtE,iEAAiE;IACjE,sEAAsE;IACtE,qEAAqE;IACrES,cAAc,CAACD,OAAO,CAACA,IAAIE,UAAU,GAAG3B,UAAUY,QAAQ,WAAW;QAAEgB,OAAOH;QAAKT,YAAY;IAAK,KAAKJ,QACzGa;;AAEF,IAAII,eAAe,SAACJ;WAAQR,YAAYjB,UAAU,CAAC,GAAG,cAAc;QAAE4B,OAAO;IAAK,IAAIH;;AAEtF,qCAAqC;AC7BrC,IAAAK,6BAAA,CAAA;AAAAnB,SAAAmB,4BAAA;IAAAC,SAAA;eAAAA;;IAAAC,cAAA;eAAAA;;IAAAC,YAAA;eAAAA;;IAAAC,SAAA;eAAAC;;AAAA;AAAAC,OAAAC,OAAA,GAAAR,aAAAC;ADuCA,qBAAqB;AErCrB,IAAAQ,eAAyBC,QAAA;AAEzB,IAAAC,eAAkBhB,QAAAe,QAAA,eAAA;AFuClB,6BAA6B;AG3C7B,IAAAE,cAAsCF,QAAA;AACtC,IAAAG,wBAAwBH,QAAA;AAEjB,SAASI;IAAA,IAAA,IAAA,OAAA,UAAA,QAAA,AAAMC,SAAN,UAAA,OAAA,OAAA,GAAA,OAAA,MAAA;QAAMA,OAAN,QAAA,SAAA,CAAA,KAAM;;IAClB,OAAA,CAAA,GAAOF,sBAAAG,OAAA,EAAA,CAAA,GAAQJ,YAAAK,IAAA,EAAKF;AACxB;AH6CA,qBAAqB;AEvCb,IAAAG,qBAAAR,QAAA;AAJD,IAAMS,YAAY,SAACC;IACtB,IAA4B,wBAAA,CAAA,GAAIX,aAAAY,QAAA,EAAS,WAAlCC,YAAqB,SAAVC,aAAU;IAE5B,OACI,aAAA,GAAA,CAAA,GAAAL,mBAAAM,GAAA,EAACb,aAAAc,OAAAA,EAAA,wCACOL;QACJM,KAAKN,MAAMM,GAAA;QACXC,WAAWb,GACPM,MAAMO,SAAA,EACN,4BACAL,YAAY,YAAY;QAE5BM,QAAQ;mBAAML,WAAW;;;AAGrC;AF+CA,qCAAqC;AClErC,IAAMM,OAAO;IACTC,OAAO;IACPC,WAAWZ;IACXa,MAAM;QAAC;KAAU;IACjBC,YAAY;QACRC,QAAQ;IACZ;IACAC,UAAU;QACNC,KAAK;YAAEC,SAAS;QAAO;QACvBX,KAAK;YAAEW,SAAS;QAAO;QACvBC,OAAO;YAAED,SAAS;QAAS;QAC3BE,QAAQ;YAAEF,SAAS;QAAS;QAC5BV,WAAW;YAAEU,SAAS;QAAO;IACjC;AACJ;AAEA,IAAO/B,6BAAQuB;AAGR,IAAM3B,UAAiB;IAC1BsC,MAAM;QACFJ,KAAK;QACLV,KAAK;QACLY,OAAO;QACPC,QAAQ;QACRZ,WAAW;IACf;AACJ;AAEO,IAAMvB,aAAoB;IAC7BoC,MAAM;QACFJ,KAAK;QACLV,KAAK;QACLY,OAAO;QACPC,QAAQ;QACRZ,WAAW;IACf;AACJ;AAEO,IAAMxB,eAAsB;IAC/BqC,MAAM;QACFJ,KAAK;QACLV,KAAK;QACLY,OAAO;QACPC,QAAQ;QACRZ,WAAW;IACf;AACJ;AD+DA,6DAA6D;AAC7D,KAAMpB,CAAAA,OAAOC,OAAO,GAAG;IACrBN,SAAAA;IACAC,cAAAA;IACAC,YAAAA;AACF,CAAA","sourcesContent":["\"use strict\";\nvar __create = Object.create;\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __getProtoOf = Object.getPrototypeOf;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n  for (var name in all)\n    __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(\n  // If the importer is in node compatibility mode or this is not an ESM\n  // file that has been converted to a CommonJS file using a Babel-\n  // compatible transform (i.e. \"__esModule\" has not been set), then set\n  // \"default\" to the CommonJS \"module.exports\" for node compatibility.\n  isNodeMode || !mod || !mod.__esModule ? __defProp(target, \"default\", { value: mod, enumerable: true }) : target,\n  mod\n));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\n\n// src/stories/blur-image.stories.tsx\nvar blur_image_stories_exports = {};\n__export(blur_image_stories_exports, {\n  Default: () => Default,\n  RoundedImage: () => RoundedImage,\n  SmallImage: () => SmallImage,\n  default: () => blur_image_stories_default\n});\nmodule.exports = __toCommonJS(blur_image_stories_exports);\n\n// src/blur-image.tsx\nvar import_react = require(\"react\");\nvar import_image = __toESM(require(\"next/image\"), 1);\n\n// ../utils/src/classMerge.ts\nvar import_clsx = require(\"clsx\");\nvar import_tailwind_merge = require(\"tailwind-merge\");\nfunction cn(...inputs) {\n  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));\n}\n\n// src/blur-image.tsx\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar BlurImage = (props) => {\n  const [isLoading, setLoading] = (0, import_react.useState)(true);\n  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(\n    import_image.default,\n    {\n      ...props,\n      alt: props.alt,\n      className: cn(\n        props.className,\n        \"duration-500 ease-in-out\",\n        isLoading ? \"blur-sm\" : \"blur-0\"\n      ),\n      onLoad: () => setLoading(false)\n    }\n  );\n};\n\n// src/stories/blur-image.stories.tsx\nvar meta = {\n  title: \"Components/BlurImage\",\n  component: BlurImage,\n  tags: [\"autodocs\"],\n  parameters: {\n    layout: \"centered\"\n  },\n  argTypes: {\n    src: { control: \"text\" },\n    alt: { control: \"text\" },\n    width: { control: \"number\" },\n    height: { control: \"number\" },\n    className: { control: \"text\" }\n  }\n};\nvar blur_image_stories_default = meta;\nvar Default = {\n  args: {\n    src: \"https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1\",\n    alt: \"Sample image with blur effect\",\n    width: 400,\n    height: 300,\n    className: \"rounded-lg\"\n  }\n};\nvar SmallImage = {\n  args: {\n    src: \"https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1\",\n    alt: \"Small sample image with blur effect\",\n    width: 200,\n    height: 150,\n    className: \"rounded-lg\"\n  }\n};\nvar RoundedImage = {\n  args: {\n    src: \"https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1\",\n    alt: \"Rounded sample image with blur effect\",\n    width: 300,\n    height: 300,\n    className: \"rounded-full\"\n  }\n};\n// Annotate the CommonJS export names for ESM import in node:\n0 && (module.exports = {\n  Default,\n  RoundedImage,\n  SmallImage\n});\n","import type { Meta, StoryObj } from '@storybook/react';\nimport { BlurImage } from '../blur-image';\n\nconst meta = {\n    title: 'Components/BlurImage',\n    component: BlurImage,\n    tags: ['autodocs'],\n    parameters: {\n        layout: 'centered',\n    },\n    argTypes: {\n        src: { control: 'text' },\n        alt: { control: 'text' },\n        width: { control: 'number' },\n        height: { control: 'number' },\n        className: { control: 'text' },\n    },\n} satisfies Meta<typeof BlurImage>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n    args: {\n        src: 'https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',\n        alt: 'Sample image with blur effect',\n        width: 400,\n        height: 300,\n        className: 'rounded-lg',\n    },\n};\n\nexport const SmallImage: Story = {\n    args: {\n        src: 'https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',\n        alt: 'Small sample image with blur effect',\n        width: 200,\n        height: 150,\n        className: 'rounded-lg',\n    },\n};\n\nexport const RoundedImage: Story = {\n    args: {\n        src: 'https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',\n        alt: 'Rounded sample image with blur effect',\n        width: 300,\n        height: 300,\n        className: 'rounded-full',\n    },\n};","\"use client\";\n\nimport { useState } from \"react\";\nimport type { ComponentProps } from \"react\";\nimport Image from \"next/image\";\nimport { cn } from \"@c-rex/utils\";\n\nexport const BlurImage = (props: ComponentProps<typeof Image>) => {\n    const [isLoading, setLoading] = useState(true);\n\n    return (\n        <Image\n            {...props}\n            alt={props.alt}\n            className={cn(\n                props.className,\n                \"duration-500 ease-in-out\",\n                isLoading ? \"blur-sm\" : \"blur-0\",\n            )}\n            onLoad={() => setLoading(false)}\n        />\n    );\n}\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n    return twMerge(clsx(inputs));\n}\n"]}

package/dist/stories/blur-image.stories.d.cts

@@ -0,0 +1,37 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import * as Image from 'next/image';
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: (props: react.ComponentProps<typeof Image.default>) => react_jsx_runtime.JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    argTypes: {
+        src: {
+            control: "text";
+        };
+        alt: {
+            control: "text";
+        };
+        width: {
+            control: "number";
+        };
+        height: {
+            control: "number";
+        };
+        className: {
+            control: "text";
+        };
+    };
+};
+
+type Story = StoryObj<typeof meta>;
+declare const Default: Story;
+declare const SmallImage: Story;
+declare const RoundedImage: Story;
+
+export { Default, RoundedImage, SmallImage, meta as default };

package/dist/stories/blur-image.stories.d.ts

@@ -0,0 +1,37 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import * as Image from 'next/image';
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: (props: react.ComponentProps<typeof Image.default>) => react_jsx_runtime.JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    argTypes: {
+        src: {
+            control: "text";
+        };
+        alt: {
+            control: "text";
+        };
+        width: {
+            control: "number";
+        };
+        height: {
+            control: "number";
+        };
+        className: {
+            control: "text";
+        };
+    };
+};
+
+type Story = StoryObj<typeof meta>;
+declare const Default: Story;
+declare const SmallImage: Story;
+declare const RoundedImage: Story;
+
+export { Default, RoundedImage, SmallImage, meta as default };

package/dist/stories/blur-image.stories.esm.js

@@ -0,0 +1,180 @@
+// src/blur-image.tsx
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _non_iterable_rest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
+import { useState } from "react";
+import Image from "next/image";
+// ../utils/src/classMerge.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn() {
+    for(var _len = arguments.length, inputs = new Array(_len), _key = 0; _key < _len; _key++){
+        inputs[_key] = arguments[_key];
+    }
+    return twMerge(clsx(inputs));
+}
+// src/blur-image.tsx
+import { jsx } from "react/jsx-runtime";
+var BlurImage = function(props) {
+    var _useState = _sliced_to_array(useState(true), 2), isLoading = _useState[0], setLoading = _useState[1];
+    return /* @__PURE__ */ jsx(Image, _object_spread_props(_object_spread({}, props), {
+        alt: props.alt,
+        className: cn(props.className, "duration-500 ease-in-out", isLoading ? "blur-sm" : "blur-0"),
+        onLoad: function() {
+            return setLoading(false);
+        }
+    }));
+};
+// src/stories/blur-image.stories.tsx
+var meta = {
+    title: "Components/BlurImage",
+    component: BlurImage,
+    tags: [
+        "autodocs"
+    ],
+    parameters: {
+        layout: "centered"
+    },
+    argTypes: {
+        src: {
+            control: "text"
+        },
+        alt: {
+            control: "text"
+        },
+        width: {
+            control: "number"
+        },
+        height: {
+            control: "number"
+        },
+        className: {
+            control: "text"
+        }
+    }
+};
+var blur_image_stories_default = meta;
+var Default = {
+    args: {
+        src: "https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
+        alt: "Sample image with blur effect",
+        width: 400,
+        height: 300,
+        className: "rounded-lg"
+    }
+};
+var SmallImage = {
+    args: {
+        src: "https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
+        alt: "Small sample image with blur effect",
+        width: 200,
+        height: 150,
+        className: "rounded-lg"
+    }
+};
+var RoundedImage = {
+    args: {
+        src: "https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
+        alt: "Rounded sample image with blur effect",
+        width: 300,
+        height: 300,
+        className: "rounded-full"
+    }
+};
+export { Default, RoundedImage, SmallImage, blur_image_stories_default as default };
+//# sourceMappingURL=blur-image.stories.esm.js.map

package/dist/stories/blur-image.stories.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/periotto/Desktop/workspace/c-rex.net-web-client-foundation/packages/components/dist/stories/blur-image.stories.esm.js","../../src/blur-image.tsx","../../../utils/src/classMerge.ts","../../src/stories/blur-image.stories.tsx"],"names":["useState","Image","clsx","twMerge","cn","inputs","jsx","BlurImage","props","isLoading","setLoading","alt","className","onLoad","meta","title","component","tags","parameters","layout","argTypes","src","control","width","height","blur_image_stories_default","Default","args","SmallImage","RoundedImage","default"],"mappings":"AAAA,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACErB,SAASA,QAAA,QAAgB,QAAA;AAEzB,OAAOC,WAAW,aAAA;ADAlB,6BAA6B;AEJ7B,SAASC,IAAA,QAA6B,OAAA;AACtC,SAASC,OAAA,QAAe,iBAAA;AAEjB,SAASC;IAAA,IAAA,IAAA,OAAA,UAAA,QAAA,AAAMC,SAAN,UAAA,OAAA,OAAA,GAAA,OAAA,MAAA;QAAMA,OAAN,QAAA,SAAA,CAAA,KAAM;;IAClB,OAAOF,QAAQD,KAAKG;AACxB;AFMA,qBAAqB;ACAb,SAAAC,GAAA,QAAA,oBAAA;AAJD,IAAMC,YAAY,SAACC;IACtB,IAAgCR,6BAAAA,SAAS,WAAlCS,YAAyBT,cAAdU,aAAcV;IAEhC,OACI,aAAA,GAAAM,IAACL,OAAA,wCACOO;QACJG,KAAKH,MAAMG,GAAA;QACXC,WAAWR,GACPI,MAAMI,SAAA,EACN,4BACAH,YAAY,YAAY;QAE5BI,QAAQ;mBAAMH,WAAW;;;AAGrC;ADQA,qCAAqC;AG3BrC,IAAMI,OAAO;IACTC,OAAO;IACPC,WAAWT;IACXU,MAAM;QAAC;KAAU;IACjBC,YAAY;QACRC,QAAQ;IACZ;IACAC,UAAU;QACNC,KAAK;YAAEC,SAAS;QAAO;QACvBX,KAAK;YAAEW,SAAS;QAAO;QACvBC,OAAO;YAAED,SAAS;QAAS;QAC3BE,QAAQ;YAAEF,SAAS;QAAS;QAC5BV,WAAW;YAAEU,SAAS;QAAO;IACjC;AACJ;AAEA,IAAOG,6BAAQX;AAGR,IAAMY,UAAiB;IAC1BC,MAAM;QACFN,KAAK;QACLV,KAAK;QACLY,OAAO;QACPC,QAAQ;QACRZ,WAAW;IACf;AACJ;AAEO,IAAMgB,aAAoB;IAC7BD,MAAM;QACFN,KAAK;QACLV,KAAK;QACLY,OAAO;QACPC,QAAQ;QACRZ,WAAW;IACf;AACJ;AAEO,IAAMiB,eAAsB;IAC/BF,MAAM;QACFN,KAAK;QACLV,KAAK;QACLY,OAAO;QACPC,QAAQ;QACRZ,WAAW;IACf;AACJ;AHwBA,SACEc,OAAO,EACPG,YAAY,EACZD,UAAU,EACVH,8BAA8BK,OAAO,GACrC","sourcesContent":["// src/blur-image.tsx\nimport { useState } from \"react\";\nimport Image from \"next/image\";\n\n// ../utils/src/classMerge.ts\nimport { clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\nfunction cn(...inputs) {\n  return twMerge(clsx(inputs));\n}\n\n// src/blur-image.tsx\nimport { jsx } from \"react/jsx-runtime\";\nvar BlurImage = (props) => {\n  const [isLoading, setLoading] = useState(true);\n  return /* @__PURE__ */ jsx(\n    Image,\n    {\n      ...props,\n      alt: props.alt,\n      className: cn(\n        props.className,\n        \"duration-500 ease-in-out\",\n        isLoading ? \"blur-sm\" : \"blur-0\"\n      ),\n      onLoad: () => setLoading(false)\n    }\n  );\n};\n\n// src/stories/blur-image.stories.tsx\nvar meta = {\n  title: \"Components/BlurImage\",\n  component: BlurImage,\n  tags: [\"autodocs\"],\n  parameters: {\n    layout: \"centered\"\n  },\n  argTypes: {\n    src: { control: \"text\" },\n    alt: { control: \"text\" },\n    width: { control: \"number\" },\n    height: { control: \"number\" },\n    className: { control: \"text\" }\n  }\n};\nvar blur_image_stories_default = meta;\nvar Default = {\n  args: {\n    src: \"https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1\",\n    alt: \"Sample image with blur effect\",\n    width: 400,\n    height: 300,\n    className: \"rounded-lg\"\n  }\n};\nvar SmallImage = {\n  args: {\n    src: \"https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1\",\n    alt: \"Small sample image with blur effect\",\n    width: 200,\n    height: 150,\n    className: \"rounded-lg\"\n  }\n};\nvar RoundedImage = {\n  args: {\n    src: \"https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1\",\n    alt: \"Rounded sample image with blur effect\",\n    width: 300,\n    height: 300,\n    className: \"rounded-full\"\n  }\n};\nexport {\n  Default,\n  RoundedImage,\n  SmallImage,\n  blur_image_stories_default as default\n};\n","\"use client\";\n\nimport { useState } from \"react\";\nimport type { ComponentProps } from \"react\";\nimport Image from \"next/image\";\nimport { cn } from \"@c-rex/utils\";\n\nexport const BlurImage = (props: ComponentProps<typeof Image>) => {\n    const [isLoading, setLoading] = useState(true);\n\n    return (\n        <Image\n            {...props}\n            alt={props.alt}\n            className={cn(\n                props.className,\n                \"duration-500 ease-in-out\",\n                isLoading ? \"blur-sm\" : \"blur-0\",\n            )}\n            onLoad={() => setLoading(false)}\n        />\n    );\n}\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n    return twMerge(clsx(inputs));\n}\n","import type { Meta, StoryObj } from '@storybook/react';\nimport { BlurImage } from '../blur-image';\n\nconst meta = {\n    title: 'Components/BlurImage',\n    component: BlurImage,\n    tags: ['autodocs'],\n    parameters: {\n        layout: 'centered',\n    },\n    argTypes: {\n        src: { control: 'text' },\n        alt: { control: 'text' },\n        width: { control: 'number' },\n        height: { control: 'number' },\n        className: { control: 'text' },\n    },\n} satisfies Meta<typeof BlurImage>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n    args: {\n        src: 'https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',\n        alt: 'Sample image with blur effect',\n        width: 400,\n        height: 300,\n        className: 'rounded-lg',\n    },\n};\n\nexport const SmallImage: Story = {\n    args: {\n        src: 'https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',\n        alt: 'Small sample image with blur effect',\n        width: 200,\n        height: 150,\n        className: 'rounded-lg',\n    },\n};\n\nexport const RoundedImage: Story = {\n    args: {\n        src: 'https://images.pexels.com/photos/31712301/pexels-photo-31712301/free-photo-of-scenic-cycling-tour-in-andernach-fields.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',\n        alt: 'Rounded sample image with blur effect',\n        width: 300,\n        height: 300,\n        className: 'rounded-full',\n    },\n};"]}