asab_webui_components 26.1.5 → 26.1.7

package/dist/components/CopyableInput/CopyableInput.js

@@ -0,0 +1,78 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CopyableInput = void 0;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactI18next = require("react-i18next");
+var _reactstrap = require("reactstrap");
+require("./CopyableInput.scss");
+var _excluded = ["value"];
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+/*
+	Read-only text area component that displays a value with a copy button
+
+	Props:
+		value: Component value to be displayed and copied
+		...props: Props to pass to the InputGroup child component
+
+	Usage:
+		import { CopyableInput } from 'asab_webui_components';
+
+		const generatedUrl = 'https://example.com/somesecret?token=c29tZXNlY3JldAo';
+		...
+
+		<CopyableInput
+			value={generatedUrl}
+			className='my-2'
+		/>
+*/
+var CopyableInput = _ref => {
+  var {
+      value
+    } = _ref,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var {
+    t
+  } = (0, _reactI18next.useTranslation)();
+  var [valueCopied, setValueCopied] = (0, _react.useState)(false);
+  var timeoutRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
+    return () => {
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+    };
+  }, []);
+
+  // Copy the value to clipboard and change the button label for a short time as a visual feedback
+  var copyValue = () => {
+    if (!value) {
+      console.error('No input value to copy.');
+      return;
+    }
+    navigator.clipboard.writeText(value).then(() => {
+      setValueCopied(true);
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+      timeoutRef.current = setTimeout(() => setValueCopied(false), 3000);
+    }).catch(error => {
+      console.error('Failed to copy input value: ', error);
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement(_reactstrap.InputGroup, props, /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
+    readOnly: true,
+    value: value,
+    type: "textarea",
+    className: "asab-copyable-input"
+  }), /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
+    outline: true,
+    title: t('General|Copy to clipboard'),
+    color: "primary",
+    className: "text-nowrap border",
+    onClick: copyValue
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: valueCopied ? 'bi bi-clipboard-check pe-2' : 'bi bi-clipboard pe-2'
+  }), valueCopied ? t('General|Copied!') : t('General|Copy')));
+};
+exports.CopyableInput = CopyableInput;

package/dist/components/CopyableInput/CopyableInput.scss

@@ -0,0 +1,5 @@
+.asab-copyable-input {
+    white-space: pre-wrap;
+    word-break: break-all;
+    resize: none;
+}

package/dist/components/DateTime/utils/validateDateTime.js

@@ -4,6 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.validateDateTime = validateDateTime;
+// For best performance, create a regular expression only once.
+var n_digits = /^\d+n$/;
 function validateDateTime(value) {
   // Return 'Invalid Date' if the input is null or undefined
   if (value == null) {
@@ -18,6 +20,15 @@ function validateDateTime(value) {
 
   // Handle string values
   if (typeof value === 'string') {
+    // Check if string ends with 'n' AND verify the entire string consists only of digits followed by 'n'
+    if (value.endsWith('n') && n_digits.test(value)) {
+      try {
+        // Remove the 'n' suffix before converting to BigInt
+        return splDatetimeToIso(BigInt(value.slice(0, -1)));
+      } catch (_unused) {
+        return 'Invalid Date';
+      }
+    }
     return new Date(value);
   }
 

package/dist/components/DateTime/utils/validateDateTime.jsx

@@ -1,3 +1,6 @@
+// For best performance, create a regular expression only once.
+const n_digits = /^\d+n$/;
+
 export function validateDateTime(value) {
 	// Return 'Invalid Date' if the input is null or undefined
 	if (value == null) {
@@ -12,6 +15,15 @@ export function validateDateTime(value) {
 
 	// Handle string values
 	if (typeof value === 'string') {
+		// Check if string ends with 'n' AND verify the entire string consists only of digits followed by 'n'
+		if (value.endsWith('n') && n_digits.test(value)) {
+			try {
+				// Remove the 'n' suffix before converting to BigInt
+				return splDatetimeToIso(BigInt(value.slice(0, -1)));
+			} catch {
+				return 'Invalid Date';
+			}
+		}
 		return new Date(value);
 	}
 

package/dist/index.js

@@ -52,6 +52,12 @@ Object.defineProperty(exports, "ControlledSwitch", {
     return _ControlledSwitch.default;
   }
 });
+Object.defineProperty(exports, "CopyableInput", {
+  enumerable: true,
+  get: function get() {
+    return _CopyableInput.CopyableInput;
+  }
+});
 Object.defineProperty(exports, "DataTable", {
   enumerable: true,
   get: function get() {
@@ -353,5 +359,6 @@ var _FlowbiteIllustration = require("./components/FlowbiteIllustration.js");
 var _PubSubContext = require("./components/Context/PubSubContext");
 var _AppStore = require("./components/Context/store/AppStore.js");
 var _reducerRegistry = require("./components/Context/store/reducer/reducerRegistry.js");
+var _CopyableInput = require("./components/CopyableInput/CopyableInput");
 var _Pagination = _interopRequireDefault(require("./components/DataTable/Pagination"));
 var _DataTable2 = require("./components/DataTable");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asab_webui_components",
-  "version": "26.1.5",
+  "version": "26.1.7",
   "license": "BSD-3-Clause",
   "description": "TeskaLabs ASAB WebUI Components Library",
   "contributors": [