@appcorp/app-corp-vista 0.1.5 → 0.1.7

package/molecules/vista-text-input-v1.js

@@ -19,9 +19,9 @@ var VistaTextInputV1 = function (_a) {
         react_1.default.createElement("div", { className: "relative" },
             prefix && (react_1.default.createElement("div", { className: "pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3" },
                 react_1.default.createElement("span", { className: "text-gray-500 sm:text-sm" }, prefix))),
-            react_1.default.createElement("input", { autoComplete: id, className: "block w-full rounded-md border-0 bg-white/5 dark:bg-white/5 py-1.5 text-gray-900 dark:text-white shadow-sm ring-1 ring-inset ring-gray-200 focus:ring-2 focus:ring-inset focus:ring-primary disabled:cursor-not-allowed disabled:bg-gray-50 disabled:text-gray-300 disabled:ring-gray-200 sm:text-sm/6 dark:disabled:bg-gray-800 dark:disabled:text-gray-400 dark:disabled:ring-gray-700 placeholder:text-gray-500 ".concat(prefix && 'pl-7', " ").concat(className), id: id, disabled: disabled, name: id, onChange: function (e) {
+            react_1.default.createElement("input", { autoComplete: id, className: "block w-full rounded-md border-0 bg-white/5 dark:bg-white/5 py-1.5 text-gray-900 dark:text-white shadow-sm ring-1 ring-inset ring-gray-200 focus:ring-2 focus:ring-inset focus:ring-primary disabled:cursor-not-allowed disabled:bg-gray-50 disabled:text-gray-300 disabled:ring-gray-200 sm:text-sm/6 dark:disabled:bg-gray-800 dark:disabled:text-gray-400 dark:disabled:ring-gray-700 placeholder:text-gray-500 ".concat(prefix && 'pl-7', " ").concat(className), disabled: disabled, id: id, name: id, onChange: function (e) {
                     return handleOnChange(id, e.target.value);
-                }, placeholder: placeholder, readOnly: readOnly, type: type, value: value, autoFocus: autoFocus }),
+                }, autoFocus: autoFocus, placeholder: placeholder, readOnly: readOnly, required: required, type: type, value: value }),
             suffix && (react_1.default.createElement("div", { className: "pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3" },
                 react_1.default.createElement("span", { id: "price-currency", className: "text-gray-500 sm:text-sm" }, suffix)))),
         info && !error && (react_1.default.createElement("p", { id: "".concat(id, "-info"), className: "mt-2 text-sm text-primary" }, info)),

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

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { VistaUploadV1Props } from '../../type/vista-upload-type';
+export declare const VistaUploadV1: FC<VistaUploadV1Props>;

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

@@ -0,0 +1,65 @@
+'use client';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VistaUploadV1 = void 0;
+var react_1 = __importStar(require("react"));
+var outline_1 = require("@heroicons/react/24/outline");
+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, handleOnChange = _a.handleOnChange, id = _a.id, 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 inputRef = (0, react_1.useRef)(null);
+    var handleClick = function (e) {
+        var _a;
+        e.stopPropagation();
+        (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    };
+    return (react_1.default.createElement("div", { className: className },
+        react_1.default.createElement("label", { htmlFor: id, className: "block text-sm/6 font-medium text-gray-900 dark:text-white" },
+            label,
+            " ",
+            required && react_1.default.createElement("sup", { className: "text-red-500" }, "*")),
+        react_1.default.createElement("div", { className: "mt-2 flex justify-center rounded-lg border border-dashed border-gray-500 px-6 py-10", onClick: handleClick },
+            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("p", { className: "pl-1" }, "or drag and drop")),
+                fileInfo && (react_1.default.createElement("p", { className: "text-xs/5 text-gray-500" }, fileInfo)))),
+        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))));
+};
+exports.VistaUploadV1 = VistaUploadV1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appcorp/app-corp-vista",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "scripts": {
     "build": "yarn clean && yarn build:ts && cp package.json lib && cp README.md lib",
     "build:next": "next build",

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

@@ -0,0 +1,13 @@
+import { ChangeEvent, HTMLInputTypeAttribute } from "react";
+export interface VistaUploadV1Props {
+    className?: string;
+    disabled?: boolean;
+    error?: string;
+    fileInfo?: string;
+    handleOnChange: (e: ChangeEvent<HTMLInputElement>) => void;
+    id: string;
+    info?: string;
+    label?: string;
+    required?: boolean;
+    type?: HTMLInputTypeAttribute;
+}

package/type/vista-upload-type.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/utils/form-schema.d.ts

@@ -7,6 +7,7 @@ import { VistaVerticalDividerV4Props } from "../type/vista-vertical-divider-type
 import { VistaCheckboxV1Props, VistaCheckboxV2Props, VistaCheckboxV3Props } from "../type/vista-checkbox-type";
 import { VistaRadioV1Props } from "../type/vista-radio-type";
 import { VistaButtonV1Props } from "../type/vista-button-type";
+import { VistaUploadV1Props } from "../type/vista-upload-type";
 export declare enum VISTA_FORM_ELEMENTS {
     BUTTON_V1 = "BUTTON_V1",
     CHECKBOX_V1 = "CHECKBOX_V1",
@@ -17,7 +18,8 @@ export declare enum VISTA_FORM_ELEMENTS {
     RADIO_V1 = "RADIO_V1",
     SELECT_V1 = "SELECT_V1",
     TEXT_AREA_V1 = "TEXT_AREA_V1",
-    TEXT_INPUT_V1 = "TEXT_INPUT_V1"
+    TEXT_INPUT_V1 = "TEXT_INPUT_V1",
+    UPLOAD_V1 = "UPLOAD_V1"
 }
 export declare const formSchema: {
     BUTTON_V1: (props: VistaButtonV1Props) => React.JSX.Element;
@@ -30,4 +32,5 @@ export declare const formSchema: {
     SELECT_V1: (props: VistaSelectV1Props) => React.JSX.Element;
     TEXT_AREA_V1: (props: VistaTextAreaV1Props) => React.JSX.Element;
     TEXT_INPUT_V1: (props: VistaTextInputV1Props) => React.JSX.Element;
+    UPLOAD_V1: (props: VistaUploadV1Props) => React.JSX.Element;
 };

package/utils/form-schema.js

@@ -27,6 +27,7 @@ var vista_checkbox_v2_1 = require("../molecules/vista-checkbox-v2/vista-checkbox
 var vista_checkbox_v3_1 = require("../molecules/vista-checkbox-v3/vista-checkbox-v3");
 var vista_radio_v1_1 = require("../molecules/vista-radio-v1/vista-radio-v1");
 var vista_button_v1_1 = require("../molecules/vista-button-v1/vista-button-v1");
+var vista_upload_v1_1 = require("../molecules/vista-upload-v1/vista-upload-v1");
 var VISTA_FORM_ELEMENTS;
 (function (VISTA_FORM_ELEMENTS) {
     VISTA_FORM_ELEMENTS["BUTTON_V1"] = "BUTTON_V1";
@@ -39,6 +40,7 @@ var VISTA_FORM_ELEMENTS;
     VISTA_FORM_ELEMENTS["SELECT_V1"] = "SELECT_V1";
     VISTA_FORM_ELEMENTS["TEXT_AREA_V1"] = "TEXT_AREA_V1";
     VISTA_FORM_ELEMENTS["TEXT_INPUT_V1"] = "TEXT_INPUT_V1";
+    VISTA_FORM_ELEMENTS["UPLOAD_V1"] = "UPLOAD_V1";
 })(VISTA_FORM_ELEMENTS || (exports.VISTA_FORM_ELEMENTS = VISTA_FORM_ELEMENTS = {}));
 exports.formSchema = (_a = {},
     _a[VISTA_FORM_ELEMENTS.BUTTON_V1] = function (props) { return react_1.default.createElement(vista_button_v1_1.VistaButtonV1, __assign({}, props)); },
@@ -51,4 +53,5 @@ exports.formSchema = (_a = {},
     _a[VISTA_FORM_ELEMENTS.SELECT_V1] = function (props) { return react_1.default.createElement(vista_select_v1_1.VistaSelectV1, __assign({}, props)); },
     _a[VISTA_FORM_ELEMENTS.TEXT_AREA_V1] = function (props) { return react_1.default.createElement(vista_text_area_v1_1.VistaTextAreaV1, __assign({}, props)); },
     _a[VISTA_FORM_ELEMENTS.TEXT_INPUT_V1] = function (props) { return react_1.default.createElement(vista_text_input_v1_1.VistaTextInputV1, __assign({}, props)); },
+    _a[VISTA_FORM_ELEMENTS.UPLOAD_V1] = function (props) { return react_1.default.createElement(vista_upload_v1_1.VistaUploadV1, __assign({}, props)); },
     _a);