@apify/ui-library 1.161.4 → 1.162.0

package/dist/utils/copy_to_clipboard.d.ts

@@ -1,6 +1,6 @@
 interface UseCopyToClipboard {
     isCopied: boolean;
-    copyToClipboard(textToCopy: string): Promise<void>;
+    copyToClipboard: (textToCopy: string) => Promise<void>;
 }
 export declare function useCopyToClipboard(timeoutMs?: number): UseCopyToClipboard;
 export {};

package/dist/utils/copy_to_clipboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"copy_to_clipboard.d.ts","sourceRoot":"","sources":["../../src/utils/copy_to_clipboard.ts"],"names":[],"mappings":"AAEA,UAAU,kBAAkB;IACxB,QAAQ,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACtD;AAED,wBAAgB,kBAAkB,CAAC,SAAS,SAAO,GAAG,kBAAkB,CAyBvE"}
+{"version":3,"file":"copy_to_clipboard.d.ts","sourceRoot":"","sources":["../../src/utils/copy_to_clipboard.ts"],"names":[],"mappings":"AAEA,UAAU,kBAAkB;IACxB,QAAQ,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC1D;AAED,wBAAgB,kBAAkB,CAAC,SAAS,SAAO,GAAG,kBAAkB,CAyBvE"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@apify/ui-library",
-    "version": "1.161.4",
+    "version": "1.162.0",
     "description": "React UI library used by apify.com",
     "license": "Apache-2.0",
     "type": "module",
@@ -42,7 +42,7 @@
         "It's not nice, but helps us to get around the problem of multiple react instances."
     ],
     "dependencies": {
-        "@apify/ui-icons": "^1.49.0",
+        "@apify/ui-icons": "^1.50.0",
         "@floating-ui/react": "^0.27.19",
         "@floating-ui/react-dom": "^2.1.8",
         "@radix-ui/react-checkbox": "^1.3.3",
@@ -75,7 +75,7 @@
         "styled-components": "^6.1.19"
     },
     "devDependencies": {
-        "@apify-packages/types": "^3.416.2",
+        "@apify-packages/types": "^3.417.0",
         "@storybook/react-vite": "^10.3.5",
         "@testing-library/react": "^16.3.2",
         "@types/hast": "^3.0.4",
@@ -95,5 +95,5 @@
         "src",
         "style"
     ],
-    "gitHead": "e0e3f8bc723aaf346198ef7f4e929ce0dc7549c8"
+    "gitHead": "4151861eb12b7ae59e86d583830d7ffbac4e92f7"
 }

package/src/components/code/one_line_code/one_line_code.tsx

@@ -7,6 +7,7 @@ import type { HttpMethod } from '@apify-packages/types';
 
 import { theme } from '../../../design_system/theme';
 import type { BoxProps } from '../../box';
+import { InlineSpinner } from '../../spinner';
 import { Text } from '../../text';
 import type { SharedTextSize } from '../../text/text_shared';
 import { ActionButton, CopyButton } from '../action_button';
@@ -151,6 +152,8 @@ export type OneLineCodeProps = Omit<BoxProps, 'children'> & {
     fullWidth?: boolean;
     secretPlaceholder?: string;
     secret?: string;
+    hideSecretButton?: boolean;
+    isCopyLoading?: boolean;
     disabled?: boolean;
     hideCopyButton?: boolean;
     trackingBundle?: OneLineCodeTrackingBundle;
@@ -166,6 +169,8 @@ export function OneLineCode({
     fullWidth,
     secretPlaceholder = '***',
     secret,
+    hideSecretButton,
+    isCopyLoading,
     disabled,
     hideCopyButton,
     trackingBundle,
@@ -212,7 +217,7 @@ export function OneLineCode({
                 <div className={oneLineCodeClassNames.gradient} />
             </div>
             <div className={oneLineCodeClassNames.buttons}>
-                {hasSecret && (
+                {hasSecret && !hideSecretButton && (
                     <ActionButton
                         onClick={() => setShowSecret((prev) => !prev)}
                         trackingId={trackingBundle?.secret?.trackingId}
@@ -222,13 +227,18 @@ export function OneLineCode({
                         {showSecret ? <EyeOffIcon size="16" /> : <EyeIcon size="16" />}
                     </ActionButton>
                 )}
-                {!hideCopyButton && (
-                    <CopyButton
-                        code={codeWithSecret}
-                        trackingId={trackingBundle?.copy?.trackingId}
-                        trackingData={trackingBundle?.copy?.trackingData}
-                    />
-                )}
+                {!hideCopyButton &&
+                    (isCopyLoading ? (
+                        <ActionButton disabled aria-label="Loading">
+                            <InlineSpinner size={theme.space.space16} />
+                        </ActionButton>
+                    ) : (
+                        <CopyButton
+                            code={codeWithSecret}
+                            trackingId={trackingBundle?.copy?.trackingId}
+                            trackingData={trackingBundle?.copy?.trackingData}
+                        />
+                    ))}
                 {!!onActionButtonClick && (
                     <ActionButton
                         onClick={onActionButtonClick}

package/src/utils/copy_to_clipboard.ts

@@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react';
 
 interface UseCopyToClipboard {
     isCopied: boolean;
-    copyToClipboard(textToCopy: string): Promise<void>;
+    copyToClipboard: (textToCopy: string) => Promise<void>;
 }
 
 export function useCopyToClipboard(timeoutMs = 1000): UseCopyToClipboard {