@appcorp/app-corp-vista 0.1.42 → 0.1.43

package/molecules/vista-progress-v2/vista-progress-v2.js

@@ -43,7 +43,7 @@ var VistaProgressV2 = function (_a) {
     var getCurrentStep = (0, react_1.useMemo)(function () { return steps.filter(function (_a) {
         var name = _a.name;
         return name === currentSelected;
-    })[0]; }, [currentSelected]);
+    })[0]; }, [currentSelected, steps]);
     return (react_1.default.createElement("div", { className: "h-[calc(100vh)] ".concat(containerClassName) },
         react_1.default.createElement("nav", { "aria-label": "Progress" },
             react_1.default.createElement("ol", { role: "list", className: "divide-y divide-gray-300 rounded-md border border-gray-300 md:flex md:divide-y-0" }, steps

package/molecules/vista-upload-v1/vista-upload-v1.d.ts

@@ -1,3 +1,5 @@
 import { FC } from 'react';
 import { VistaUploadV1Props } from '../../type/vista-upload-type';
+import "slick-carousel/slick/slick.css";
+import "slick-carousel/slick/slick-theme.css";
 export declare const VistaUploadV1: FC<VistaUploadV1Props>;

package/molecules/vista-upload-v1/vista-upload-v1.js

@@ -1,5 +1,16 @@
 'use client';
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -43,9 +54,23 @@ var image_1 = __importDefault(require("next/image"));
 var outline_1 = require("@heroicons/react/24/outline");
 var vista_button_v1_1 = require("../vista-button-v1/vista-button-v1");
 var vista_button_type_1 = require("../../type/vista-button-type");
+var dynamic_1 = __importDefault(require("next/dynamic"));
+require("slick-carousel/slick/slick.css");
+require("slick-carousel/slick/slick-theme.css");
+var DynamicReactSlick = (0, dynamic_1.default)(function () { return Promise.resolve().then(function () { return __importStar(require('react-slick')); }); }, {
+    loading: function () { return react_1.default.createElement("p", null, "Loading..."); },
+    ssr: false,
+});
 var VistaUploadV1 = function (_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, error = _a.error, fileInfo = _a.fileInfo, handleClearImage = _a.handleClearImage, handleOnChange = _a.handleOnChange, id = _a.id, imageUrl = _a.imageUrl, info = _a.info, label = _a.label, _d = _a.required, required = _d === void 0 ? false : _d, _e = _a.type, type = _e === void 0 ? 'file' : _e;
+    var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, error = _a.error, fileInfo = _a.fileInfo, handleClearImage = _a.handleClearImage, handleOnChange = _a.handleOnChange, id = _a.id, imageUrls = _a.imageUrls, info = _a.info, label = _a.label, _d = _a.multiple, multiple = _d === void 0 ? false : _d, _e = _a.required, required = _e === void 0 ? false : _e, _f = _a.type, type = _f === void 0 ? 'file' : _f;
     var inputRef = (0, react_1.useRef)(null);
+    var slickConfig = {
+        dots: true,
+        infinite: true,
+        speed: 500,
+        slidesToShow: 1,
+        slidesToScroll: 1,
+    };
     var handleClick = function (e) {
         var _a;
         e.stopPropagation();
@@ -57,17 +82,18 @@ var VistaUploadV1 = function (_a) {
             " ",
             required && react_1.default.createElement("sup", { className: "text-red-500" }, "*")),
         react_1.default.createElement("div", { className: "relative mt-2 flex justify-center rounded-lg border border-dashed border-gray-500 px-6 py-10 min-h-52", onClick: handleClick },
-            !imageUrl && (react_1.default.createElement("div", { className: "text-center" },
+            !(imageUrls === null || imageUrls === void 0 ? void 0 : imageUrls.length) && (react_1.default.createElement("div", { className: "text-center" },
                 react_1.default.createElement(outline_1.PhotoIcon, { "aria-hidden": "true", className: "mx-auto size-16 text-gray-500" }),
                 react_1.default.createElement("div", { className: "mt-4 flex justify-center text-sm/6 text-gray-500" },
                     react_1.default.createElement("label", { htmlFor: "file-upload", className: "relative cursor-pointer rounded-md font-semibold text-primary focus-within:ring-2 focus-within:ring-primary focus-within:ring-offset-2 focus-within:outline-hidden hover:text-primary/50" },
                         react_1.default.createElement("span", null, "Upload a file"),
-                        react_1.default.createElement("input", { className: "sr-only", disabled: disabled, id: id, name: id, onChange: handleOnChange, ref: inputRef, required: required, type: type })),
+                        react_1.default.createElement("input", { className: "sr-only", disabled: disabled, id: id, multiple: multiple, name: id, onChange: handleOnChange, ref: inputRef, required: required, type: type })),
                     react_1.default.createElement("p", { className: "pl-1" }, "or drag and drop")),
                 fileInfo && (react_1.default.createElement("p", { className: "text-xs/5 text-gray-500" }, fileInfo)))),
-            imageUrl && (react_1.default.createElement(react_1.default.Fragment, null,
+            imageUrls && (imageUrls === null || imageUrls === void 0 ? void 0 : imageUrls.length) > 0 && (react_1.default.createElement("div", { className: 'slider-container w-full' },
                 react_1.default.createElement(vista_button_v1_1.VistaButtonV1, { className: 'absolute top-3 right-3', handleOnClick: handleClearImage, icon: react_1.default.createElement(outline_1.XMarkIcon, { className: 'size-6' }), variant: vista_button_type_1.VISTA_BUTTON_VARIANT.ICON }),
-                react_1.default.createElement(image_1.default, { alt: 'upload', className: 'object-contain', fill: true, sizes: '50vw', height: 0, src: imageUrl, width: 0 })))),
+                react_1.default.createElement(DynamicReactSlick, __assign({}, slickConfig), imageUrls.map(function (url, ind) { return (react_1.default.createElement("div", { key: ind, className: 'h-full w-full flex mx-auto' },
+                    react_1.default.createElement(image_1.default, { alt: 'upload', className: 'mx-auto object-contain', sizes: '50vw', height: 100, src: url, width: 150 }))); }))))),
         info && !error && (react_1.default.createElement("p", { id: "".concat(id, "-info"), className: "mt-2 text-sm text-primary" }, info)),
         error && !info && (react_1.default.createElement("p", { id: "".concat(id, "-error"), className: "mt-2 text-sm text-red-500 dark:text-red-500" }, error))));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appcorp/app-corp-vista",
-  "version": "0.1.42",
+  "version": "0.1.43",
   "scripts": {
     "build": "yarn clean && yarn build:ts && cp package.json lib && cp README.md lib",
     "build:next": "next build",
@@ -60,6 +60,7 @@
     "@types/react": "^19",
     "@types/react-copy-to-clipboard": "^5.0.7",
     "@types/react-dom": "^19",
+    "@types/react-slick": "^0.23.13",
     "autoprefixer": "^10.4.20",
     "clsx": "^2.1.1",
     "concurrently": "^9.1.2",
@@ -78,6 +79,8 @@
     "react": "^19",
     "react-copy-to-clipboard": "^5.1.0",
     "react-dom": "^19",
+    "react-slick": "^0.30.3",
+    "slick-carousel": "^1.8.1",
     "storybook": "^8",
     "swr": "^2.3.0",
     "tailwindcss": "^4",

package/type/vista-upload-type.d.ts

@@ -7,9 +7,10 @@ export interface VistaUploadV1Props {
     handleClearImage: () => void;
     handleOnChange: (e: ChangeEvent<HTMLInputElement>) => void;
     id: string;
-    imageUrl?: string;
+    imageUrls?: string[];
     info?: string;
     label?: string;
+    multiple?: boolean;
     required?: boolean;
     type?: HTMLInputTypeAttribute;
 }