px-react-ui-components 1.0.2 → 1.0.5

package/dist/components/MyZoomImage/MyZoomImage.js

@@ -1,7 +1,16 @@
-import React, { useRef, useState } from "react";
-import { TransformWrapper, TransformComponent, useControls } from "react-zoom-pan-pinch";
-import "./MyZoomImage.css";
-import { PiMinusBold, PiPlusBold, PiX, PiArrowUpBold, PiArrowDownBold, PiArrowLeftBold, PiArrowRightBold, PiArrowsIn } from "react-icons/pi";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactZoomPanPinch = require("react-zoom-pan-pinch");
+require("./MyZoomImage.css");
+var _pi = require("react-icons/pi");
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const Controls = ({
   wrapperRef,
   openArrow
@@ -11,7 +20,7 @@ const Controls = ({
     zoomOut,
     resetTransform,
     centerView
-  } = useControls();
+  } = (0, _reactZoomPanPinch.useControls)();
   const handlePan = (x, y) => {
     if (wrapperRef.current) {
       // debugger
@@ -21,88 +30,103 @@ const Controls = ({
       wrapperRef.current.instance.setTransformState(state.scale, state.positionX + x, state.positionY + y);
     }
   };
-  return /*#__PURE__*/React.createElement("div", {
-    className: "absolute flex flex-col gap-1 z-50 top-3 left-5"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "flex gap-1 mb-3"
-  }, /*#__PURE__*/React.createElement("button", {
-    className: "bg-slate-400 hover:bg-slate-500 rounded-full p-2",
-    onClick: () => zoomIn(),
-    title: "Zoom +"
-  }, /*#__PURE__*/React.createElement(PiPlusBold, {
-    className: "text-lg text-white"
-  })), /*#__PURE__*/React.createElement("button", {
-    className: "bg-slate-400 hover:bg-slate-500 rounded-full p-2",
-    onClick: () => zoomOut(),
-    title: "Zoom -"
-  }, /*#__PURE__*/React.createElement(PiMinusBold, {
-    className: "text-lg text-white"
-  })), /*#__PURE__*/React.createElement("button", {
-    className: "bg-slate-400 hover:bg-slate-500 rounded-full p-2",
-    onClick: () => resetTransform(),
-    title: "Zoom Cancel"
-  }, /*#__PURE__*/React.createElement(PiX, {
-    className: "text-lg text-white"
-  }))), openArrow && /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col items-center p-2"
-  }, /*#__PURE__*/React.createElement("button", {
-    className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2 mb-1",
-    onClick: () => handlePan(0, 30)
-  }, /*#__PURE__*/React.createElement(PiArrowUpBold, {
-    className: "text-lg text-white"
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "flex"
-  }, /*#__PURE__*/React.createElement("button", {
-    className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2",
-    onClick: () => handlePan(30, 0)
-  }, /*#__PURE__*/React.createElement(PiArrowLeftBold, {
-    className: "text-lg text-white"
-  })), /*#__PURE__*/React.createElement("button", {
-    className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2 ml-1 mr-1",
-    onClick: () => centerView(),
-    title: "Center"
-  }, /*#__PURE__*/React.createElement(PiArrowsIn, {
-    className: "text-lg text-white"
-  })), /*#__PURE__*/React.createElement("button", {
-    className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2",
-    onClick: () => handlePan(-30, 0)
-  }, /*#__PURE__*/React.createElement(PiArrowRightBold, {
-    className: "text-lg text-white"
-  }))), /*#__PURE__*/React.createElement("button", {
-    className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2 mt-1",
-    onClick: () => handlePan(0, -30)
-  }, /*#__PURE__*/React.createElement(PiArrowDownBold, {
-    className: "text-lg text-white"
-  }))));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "absolute flex flex-col gap-1 z-50 top-3 left-5",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "flex gap-1 mb-3",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+        className: "bg-slate-400 hover:bg-slate-500 rounded-full p-2",
+        onClick: () => zoomIn(),
+        title: "Zoom +",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pi.PiPlusBold, {
+          className: "text-lg text-white"
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+        className: "bg-slate-400 hover:bg-slate-500 rounded-full p-2",
+        onClick: () => zoomOut(),
+        title: "Zoom -",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pi.PiMinusBold, {
+          className: "text-lg text-white"
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+        className: "bg-slate-400 hover:bg-slate-500 rounded-full p-2",
+        onClick: () => resetTransform(),
+        title: "Zoom Cancel",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pi.PiX, {
+          className: "text-lg text-white"
+        })
+      })]
+    }), openArrow && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "flex flex-col items-center p-2",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+        className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2 mb-1",
+        onClick: () => handlePan(0, 30),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pi.PiArrowUpBold, {
+          className: "text-lg text-white"
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "flex",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+          className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2",
+          onClick: () => handlePan(30, 0),
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pi.PiArrowLeftBold, {
+            className: "text-lg text-white"
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+          className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2 ml-1 mr-1",
+          onClick: () => centerView(),
+          title: "Center",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pi.PiArrowsIn, {
+            className: "text-lg text-white"
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+          className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2",
+          onClick: () => handlePan(-30, 0),
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pi.PiArrowRightBold, {
+            className: "text-lg text-white"
+          })
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+        className: "bg-blue-400 hover:bg-blue-500 rounded-full p-2 mt-1",
+        onClick: () => handlePan(0, -30),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pi.PiArrowDownBold, {
+          className: "text-lg text-white"
+        })
+      })]
+    })]
+  });
 };
 const MyImageZoom = ({
   image,
   children = null,
   onZoomChange = null
 }) => {
-  const wrapperRef = useRef(null); // Ref oluştur
-  const [openArrow, setOpenArrow] = useState(false);
+  const wrapperRef = (0, _react.useRef)(null); // Ref oluştur
+  const [openArrow, setOpenArrow] = (0, _react.useState)(false);
   const handlerTransform = e => {
     setOpenArrow(e.state.scale != 1);
     if (onZoomChange != null) {
       onZoomChange(e.state);
     }
   };
-  return /*#__PURE__*/React.createElement("div", {
-    className: "zoom-container flex justify-center items-center"
-  }, /*#__PURE__*/React.createElement(TransformWrapper, {
-    ref: wrapperRef,
-    className: "w-full flex items-center justify-center",
-    onTransformed: handlerTransform
-  }, /*#__PURE__*/React.createElement(Controls, {
-    wrapperRef: wrapperRef,
-    openArrow: openArrow
-  }), /*#__PURE__*/React.createElement(TransformComponent, {
-    className: "w-full flex items-center justify-center"
-  }, children || /*#__PURE__*/React.createElement("img", {
-    src: image,
-    alt: "Zoomable",
-    className: "max-w-full object-cover rounded-md "
-  }))));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "zoom-container flex justify-center items-center",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactZoomPanPinch.TransformWrapper, {
+      ref: wrapperRef,
+      className: "w-full flex items-center justify-center",
+      onTransformed: handlerTransform,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Controls, {
+        wrapperRef: wrapperRef,
+        openArrow: openArrow
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactZoomPanPinch.TransformComponent, {
+        className: "w-full flex items-center justify-center",
+        children: children || /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+          src: image,
+          alt: "Zoomable",
+          className: "max-w-full object-cover rounded-md "
+        })
+      })]
+    })
+  });
 };
-export default MyImageZoom;
+var _default = exports.default = MyImageZoom;

package/dist/index.js

@@ -1,15 +1,131 @@
-export { default as MyInput } from './components/MyInput';
-export { default as MyAlert } from './components/MyAlert';
-export { default as MyContainer } from './components/MyContainer';
-export { default as MyEditor } from './components/MyEditor';
-export { default as MyFileUpload } from './components/MyFileUpload';
-export { default as MyImageCropper } from './components/MyImageCropper';
-export { default as MyMaps } from './components/MyMaps';
-export { default as MyMenu } from './components/MyMenu';
-export { default as MyModal } from './components/MyModal';
-export { default as MyNotFound } from './components/MyNotFound';
-export { default as MyScrollableCard } from './components/MyScrollableCard';
-export { default as MyTable } from './components/MyTable';
-export { default as MyTabs } from './components/MyTabs';
-export { default as MyWaiting } from './components/MyWaiting';
-export { default as MyZoomImage } from './components/MyZoomImage';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "MyAlert", {
+  enumerable: true,
+  get: function () {
+    return _MyAlert.default;
+  }
+});
+Object.defineProperty(exports, "MyContainer", {
+  enumerable: true,
+  get: function () {
+    return _MyContainer.default;
+  }
+});
+Object.defineProperty(exports, "MyEditor", {
+  enumerable: true,
+  get: function () {
+    return _MyEditor.default;
+  }
+});
+Object.defineProperty(exports, "MyFileUpload", {
+  enumerable: true,
+  get: function () {
+    return _MyFileUpload.default;
+  }
+});
+Object.defineProperty(exports, "MyImageCropper", {
+  enumerable: true,
+  get: function () {
+    return _MyImageCropper.default;
+  }
+});
+Object.defineProperty(exports, "MyInput", {
+  enumerable: true,
+  get: function () {
+    return _MyInput.default;
+  }
+});
+exports.MyInputType = void 0;
+Object.defineProperty(exports, "MyMaps", {
+  enumerable: true,
+  get: function () {
+    return _MyMaps.default;
+  }
+});
+Object.defineProperty(exports, "MyMenu", {
+  enumerable: true,
+  get: function () {
+    return _MyMenu.default;
+  }
+});
+Object.defineProperty(exports, "MyModal", {
+  enumerable: true,
+  get: function () {
+    return _MyModal.default;
+  }
+});
+Object.defineProperty(exports, "MyNotFound", {
+  enumerable: true,
+  get: function () {
+    return _MyNotFound.default;
+  }
+});
+Object.defineProperty(exports, "MyScrollableCard", {
+  enumerable: true,
+  get: function () {
+    return _MyScrollableCard.default;
+  }
+});
+Object.defineProperty(exports, "MyTable", {
+  enumerable: true,
+  get: function () {
+    return _MyTable.default;
+  }
+});
+Object.defineProperty(exports, "MyTabs", {
+  enumerable: true,
+  get: function () {
+    return _MyTabs.default;
+  }
+});
+Object.defineProperty(exports, "MyWaiting", {
+  enumerable: true,
+  get: function () {
+    return _MyWaiting.default;
+  }
+});
+Object.defineProperty(exports, "MyZoomImage", {
+  enumerable: true,
+  get: function () {
+    return _MyZoomImage.default;
+  }
+});
+var _MyInput = _interopRequireDefault(require("./components/MyInput"));
+var _MyAlert = _interopRequireDefault(require("./components/MyAlert"));
+var _MyContainer = _interopRequireDefault(require("./components/MyContainer"));
+var _MyEditor = _interopRequireDefault(require("./components/MyEditor"));
+var _MyFileUpload = _interopRequireDefault(require("./components/MyFileUpload"));
+var _MyImageCropper = _interopRequireDefault(require("./components/MyImageCropper"));
+var _MyMaps = _interopRequireDefault(require("./components/MyMaps"));
+var _MyMenu = _interopRequireDefault(require("./components/MyMenu"));
+var _MyModal = _interopRequireDefault(require("./components/MyModal"));
+var _MyNotFound = _interopRequireDefault(require("./components/MyNotFound"));
+var _MyScrollableCard = _interopRequireDefault(require("./components/MyScrollableCard"));
+var _MyTable = _interopRequireDefault(require("./components/MyTable"));
+var _MyTabs = _interopRequireDefault(require("./components/MyTabs"));
+var _MyWaiting = _interopRequireDefault(require("./components/MyWaiting"));
+var _MyZoomImage = _interopRequireDefault(require("./components/MyZoomImage"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// Export types
+const MyInputType = exports.MyInputType = {
+  TEXT: 'text',
+  PASSWORD: 'password',
+  SELECT: 'select',
+  SELECTFILTER: 'selectfilter',
+  FILE: 'file',
+  IMAGE: 'image',
+  TEXTAREA: 'textarea',
+  COLOR: 'color',
+  READONLY: 'readonly',
+  DATE: 'date',
+  DATETIME: 'datetime',
+  TIME: 'time',
+  MONEY: 'money',
+  NUMBER: 'number',
+  MAIL: 'mail',
+  PHONE: 'phone'
+};

package/package.json

@@ -1,21 +1,19 @@
 {
   "name": "px-react-ui-components",
-  "version": "1.0.2",
+  "version": "1.0.5",
   "main": "dist/index.js",
   "module": "dist/index.js",
-  "type": "module",
+  "type": "commonjs",
   "exports": {
-    ".": {
-      "import": "./dist/index.js",
-      "require": "./dist/index.js"
-    }
+    ".": "./dist/index.js"
   },
   "files": [
     "dist",
     "README.md"
   ],
   "scripts": {
-    "build": "babel src --out-dir dist --copy-files"
+    "build": "babel src --out-dir dist --copy-files --extensions \".js,.jsx\"",
+    "prepare": "npm run build"
   },
   "keywords": [
     "react",
@@ -38,7 +36,8 @@
   "devDependencies": {
     "@babel/cli": "^7.27.0",
     "@babel/core": "^7.26.10",
-    "@babel/preset-react": "^7.26.3"
+    "@babel/preset-react": "^7.26.3",
+    "@babel/preset-env": "^7.26.10"
   },
   "peerDependencies": {
     "react": "^18.3.1",