@geneui/components 3.0.0-next-b9c382c-15042025 → 3.0.0-next-4ef2cbc-18042025

package/CheckMark-34798545.js

@@ -0,0 +1,23 @@
+import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
+import React__default from 'react';
+
+var _excluded = ["size", "color"];
+var SvgCheckMark = function SvgCheckMark(_ref) {
+  var _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 24 : _ref$size,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? "currentColor" : _ref$color,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default.createElement("svg", _extends({
+    width: size,
+    height: size,
+    viewBox: "0 0 24 24",
+    fill: color,
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React__default.createElement("path", {
+    d: "M9.19 19.25a.75.75 0 0 1-.564-.255l-5.44-6.188a.756.756 0 0 1 .612-1.248.75.75 0 0 1 .516.253l4.867 5.535 10.491-12.33a.75.75 0 0 1 1.322.426.756.756 0 0 1-.176.55l-11.055 12.992a.756.756 0 0 1-.567.265h-.006Z",
+    fill: color
+  }));
+};
+
+export { SvgCheckMark as S };

package/Checkbox.js

@@ -1,5 +1,6 @@
 import React__default, { useRef, useState, useEffect, useMemo } from 'react';
 import { c as classNames } from './index-ce02421b.js';
+import { S as SvgCheckMark } from './CheckMark-34798545.js';
 import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
 import HelperText from './HelperText.js';
 import Label from './Label.js';
@@ -15,25 +16,6 @@ import './useEllipsisDetection-e2685fb7.js';
 import './Info.js';
 import './InfoOutlined-fc7d9afa.js';
 
-var _excluded$1 = ["size", "color"];
-var SvgCheckMark = function SvgCheckMark(_ref) {
-  var _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 24 : _ref$size,
-    _ref$color = _ref.color,
-    color = _ref$color === void 0 ? "currentColor" : _ref$color,
-    props = _objectWithoutProperties(_ref, _excluded$1);
-  return /*#__PURE__*/React__default.createElement("svg", _extends({
-    width: size,
-    height: size,
-    viewBox: "0 0 24 24",
-    fill: color,
-    xmlns: "http://www.w3.org/2000/svg"
-  }, props), /*#__PURE__*/React__default.createElement("path", {
-    d: "M9.19 19.25a.75.75 0 0 1-.564-.255l-5.44-6.188a.756.756 0 0 1 .612-1.248.75.75 0 0 1 .516.253l4.867 5.535 10.491-12.33a.75.75 0 0 1 1.322.426.756.756 0 0 1-.176.55l-11.055 12.992a.756.756 0 0 1-.567.265h-.006Z",
-    fill: color
-  }));
-};
-
 var _excluded = ["size", "color"];
 var SvgMinus = function SvgMinus(_ref) {
   var _ref$size = _ref.size,

package/Copy.js

@@ -0,0 +1,62 @@
+import React__default, { useState } from 'react';
+import { S as SvgCheckMark } from './CheckMark-34798545.js';
+import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
+import Button from './Button.js';
+import Tooltip from './Tooltip.js';
+import './index-ce02421b.js';
+import './Loader.js';
+import './style-inject.es-746bb8ed.js';
+import './floating-ui.react-0485e4db.js';
+import 'react-dom';
+import './index-7fa24b9c.js';
+import './useDebounceCallback-999deae7.js';
+
+var _excluded = ["size", "color"];
+var SvgCopy = function SvgCopy(_ref) {
+  var _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 24 : _ref$size,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? "currentColor" : _ref$color,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__default.createElement("svg", _extends({
+    width: size,
+    height: size,
+    viewBox: "0 0 24 24",
+    fill: color,
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React__default.createElement("path", {
+    d: "M18.222 1.959h-9.93a1.753 1.753 0 0 0-1.744 1.744v13.87a1.747 1.747 0 0 0 1.745 1.744h9.929a1.74 1.74 0 0 0 1.744-1.745v-13.869a1.747 1.747 0 0 0-1.744-1.744Zm.249 15.613a.248.248 0 0 1-.25.25h-9.928a.247.247 0 0 1-.25-.25v-13.869a.253.253 0 0 1 .25-.249h9.929a.253.253 0 0 1 .249.25v13.868Z",
+    fill: color
+  }), /*#__PURE__*/React__default.createElement("path", {
+    d: "M16.148 20.463h-7.985a2.704 2.704 0 0 1-2.701-2.702v-13.759a1.724 1.724 0 0 0-1.496 1.715v12.044a4.203 4.203 0 0 0 4.197 4.198h7.985a1.733 1.733 0 0 0 1.715-1.506h-1.665a.092.092 0 0 1-.05.01Z",
+    fill: color
+  }));
+};
+
+// Copy component used to copy content to the clipboard, providing visual feedback upon success.
+const CopyComponent = ({ size = "medium", value, className, contentRef, copyTooltipText = "Copy", copiedTooltipText = "Copied", appearance = "primary", disabled }) => {
+    const [isCopied, setIsCopied] = useState(false);
+    const copyContent = (e) => {
+        var _a;
+        e.stopPropagation();
+        if (isCopied)
+            return;
+        const content = value || ((_a = contentRef === null || contentRef === void 0 ? void 0 : contentRef.current) === null || _a === void 0 ? void 0 : _a.innerText);
+        if (!content)
+            return;
+        navigator.clipboard
+            .writeText(content)
+            .then(() => {
+            setIsCopied(true);
+            const id = setTimeout(() => {
+                setIsCopied(false);
+                clearTimeout(id);
+            }, 2000);
+        })
+            .catch((error) => console.error("Failed to copy:", error));
+    };
+    return (React__default.createElement(Tooltip, { text: isCopied ? copiedTooltipText : copyTooltipText, isVisible: true },
+        React__default.createElement(Button, { className: className, Icon: isCopied ? SvgCheckMark : SvgCopy, onClick: copyContent, size: size, disabled: disabled, appearance: appearance, displayType: "text" })));
+};
+
+export { CopyComponent as default };

package/components/atoms/Copy/Copy.d.ts

@@ -0,0 +1,39 @@
+import { FC, RefObject } from "react";
+interface ICopyProps {
+    /**
+     * Size of the copy and copied icons:  `small | medium | large | XSmall`,
+     */
+    size?: "small" | "medium" | "large" | "XSmall";
+    /**
+     * Additional class for the parent element.
+     * This prop should be used to set placement properties for the element relative to its parent using BEM conventions.
+     */
+    className?: string;
+    /**
+     * Reference to the content you want to copy
+     */
+    contentRef?: RefObject<HTMLElement>;
+    /**
+     * Tooltip text to display when the copy action is available. It will be shown when the user hovers over the copy icon.
+     */
+    copyTooltipText?: string;
+    /**
+     * Tooltip text to display when the copy action has been performed. It will be shown when the user clicks on the copy icon.
+     */
+    copiedTooltipText?: string;
+    /**
+     * The value to copy. If specified, this will be copied instead of the content referenced by contentRef.
+     */
+    value?: string;
+    /**
+     * Indicates the action meaning. <br>
+     * Possible values: `secondary | primary | inverse`
+     */
+    appearance?: "secondary" | "primary" | "inverse";
+    /**
+     *  Disables the copy, preventing it from being interacted with.
+     */
+    disabled?: boolean;
+}
+declare const CopyComponent: FC<ICopyProps>;
+export { ICopyProps, CopyComponent as default };

package/components/atoms/Copy/index.d.ts

@@ -0,0 +1 @@
+export { ICopyProps, default } from "./Copy";

package/index.d.ts

@@ -14,6 +14,7 @@ export { Popover, PopoverBody, PopoverFooter, PopoverFooterActions, IPopoverProp
 export { default as Badge, IBadgeProps } from "./components/atoms/Badge";
 export { default as Scrollbar, IScrollbarProps } from "./components/atoms/Scrollbar";
 export { Grid, Col, Row, IColProps, IRowProps } from "./components/atoms/Grid";
+export { default as Copy, ICopyProps } from "./components/atoms/Copy";
 export { default as Tooltip, ITooltipProps } from "./components/molecules/Tooltip";
 export { default as ProgressBar, IProgressBarProps } from "./components/molecules/ProgressBar";
 export { Steps, Step, IStepProps, IStepsProps } from "./components/molecules/Steps";

package/index.js

@@ -14,6 +14,7 @@ export { Popover, PopoverBody, PopoverFooter, PopoverFooterActions } from './Pop
 export { default as Badge } from './Badge.js';
 export { default as Scrollbar } from './Scrollbar.js';
 export { Col, Grid, Row } from './Grid.js';
+export { default as Copy } from './Copy.js';
 export { default as Tooltip } from './Tooltip.js';
 export { default as ProgressBar } from './ProgressBar.js';
 export { Step, Steps } from './Steps.js';
@@ -36,6 +37,7 @@ import './floating-ui.react-0485e4db.js';
 import 'react-dom';
 import './X-20da3b4a.js';
 import 'prop-types';
+import './CheckMark-34798545.js';
 
 const SCROLL_LOCK_CLASS = "scroll-lock";
 const useScrollLock = (target) => {

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@geneui/components",
     "description": "The Gene UI components library designed for BI tools",
-    "version": "3.0.0-next-b9c382c-15042025",
+    "version": "3.0.0-next-4ef2cbc-18042025",
     "author": "SoftConstruct",
     "homepage": "https://github.com/softconstruct/gene-ui-components#readme",
     "repository": {