bam32bittheme - npm Package Compare versions

Comparing version 2.1.140 to 2.1.142

dist/components/Input.js

@@ -9,2 +9,3 @@ "use strict";
 exports.default = void 0;
+require("core-js/modules/es.promise.js");
 require("core-js/modules/web.dom-collections.iterator.js");
@@ -26,3 +27,2 @@ var _material = require("@mui/material");
 const Input = _ref => {
-  var _inputRef$current;
   let {
@@ -48,4 +48,29 @@ debounceTime = 0,
   const [isFocused, setIsFocused] = (0, _react.useState)(false);
+  const [isAutofill, setIsAutoFill] = (0, _react.useState)(false);
   const isMobile = (0, _material.useMediaQuery)('(max-width:600px)');
   const inputRef = (0, _react.useRef)(null);
+
+  // autofill durumunu tespit eden fonksiyon
+  const detectAutofill = element => {
+    return new Promise(resolve => {
+      setTimeout(() => {
+        // tarayıcının otomatik doldurma işlemi yaptığında inputun stilini değiştirip değiştirmediğini kontrol eder
+        // eğer Chrome ve Edge gibi tarayıcılarda otomatik doldurulmuşsa `appearance: menulist-button` bu özellik görülür
+        resolve(window.getComputedStyle(element, null).getPropertyValue('appearance') === 'menulist-button');
+      }, 300); // 300ms tarayıcının autofill işlemini tamamlamasını bekle
+    });
+  };
+  (0, _react.useEffect)(() => {
+    // autofill tespiti asenkron çalıştığı için bu şekilde kullandık (IIFE - Hemen Çağrılan Asenkron Fonksiyon)
+    (async () => {
+      // eğer inputun id ve name propları varsa
+      if (props.id && props.name) {
+        // `inputRef?.current` ile inputun otomatik doldurulup doldurulmadığını kontrol et
+        if (await detectAutofill(inputRef === null || inputRef === void 0 ? void 0 : inputRef.current)) {
+          // eğer input otomatik doldurulmuşsa `setIsAutoFill(true)` ile statei güncelle
+          setIsAutoFill(true);
+        }
+      }
+    })();
+  }, []);
   const debounceHandleOnChange = (0, _useDebounce.useDebouncedCallback)(event => {
@@ -58,3 +83,3 @@ if (onChange) {
     event.persist();
-    const newValue = event.currentTarget.value || "";
+    const newValue = event.currentTarget.value || '';
     if (numberOfCharacters && (newValue === null || newValue === void 0 ? void 0 : newValue.length) > numberOfCharacters) {
@@ -69,3 +94,3 @@ return;
   }, [value]);
-  const displayedValue = toUpperCase ? innerValue.toLocaleUpperCase() || "" : innerValue || '';
+  const displayedValue = toUpperCase ? innerValue.toLocaleUpperCase() || '' : innerValue || '';
   const remainingCount = numberOfCharacters ? Math.max(numberOfCharacters - (displayedValue === null || displayedValue === void 0 ? void 0 : displayedValue.length), 0) : 0;
@@ -84,3 +109,2 @@ return /*#__PURE__*/_react.default.createElement(_material.Box, _extends({}, boxProps, {
     type: type,
-    ref: inputRef,
     margin: "normal",
@@ -119,5 +143,7 @@ fullWidth: true,
     InputLabelProps: _objectSpread({
-      shrink: Boolean(displayedValue) || isFocused || (inputRef === null || inputRef === void 0 || (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value)
+      shrink: Boolean(displayedValue) || isFocused || isAutofill
     }, InputLabelProps),
-    inputProps: _objectSpread({}, inputProps),
+    inputProps: _objectSpread({
+      ref: inputRef
+    }, inputProps),
     sx: _objectSpread({
@@ -124,0 +150,0 @@ width: '100%'

dist/components/SearchInput.js

@@ -128,3 +128,3 @@ "use strict";
         position: isMobile ? 'relative' : 'absolute',
-        right: isMobile ? 0 : 70,
+        right: isMobile ? 0 : 35,
         top: isMobile ? 0 : 10,
@@ -131,0 +131,0 @@ marginLeft: isMobile ? 1 : 0

dist/components/Table.js

@@ -0,0 +0,0 @@ "use strict";

package.json

 {
   "name": "bam32bittheme",
-  "version": "2.1.140",
+  "version": "2.1.142",
   "private": false,
@@ -5,0 +5,0 @@ "description": "32bit Theme for Material UI v5.x",

No alert changes

Improved metrics

Total package byte prevSize

1588892

0.05%

Lines of code

5709

0.44%

No dependency changes