@vritti/quantum-ui 0.3.22 → 0.3.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/CopyField.js
CHANGED
|
@@ -3,7 +3,7 @@ import { useState, useRef, useEffect, useCallback } from 'react';
|
|
|
3
3
|
import { c as cn } from './utils.js';
|
|
4
4
|
import { B as Button } from './Button.js';
|
|
5
5
|
import { T as Tooltip } from './Tooltip.js';
|
|
6
|
-
import { e as FieldLabel, b as FieldDescription } from './field.js';
|
|
6
|
+
import { F as Field, e as FieldLabel, b as FieldDescription } from './field.js';
|
|
7
7
|
import { C as Check } from './check.js';
|
|
8
8
|
import { C as Copy } from './copy.js';
|
|
9
9
|
|
|
@@ -30,8 +30,8 @@ const CopyField = ({ value, label, description, mono = true, className }) => {
|
|
|
30
30
|
}
|
|
31
31
|
}, [value]);
|
|
32
32
|
const ariaLabel = label ? `Copy ${typeof label === "string" ? label : "value"}` : "Copy value";
|
|
33
|
-
return /* @__PURE__ */ jsxs(
|
|
34
|
-
label && /* @__PURE__ */ jsx(FieldLabel, {
|
|
33
|
+
return /* @__PURE__ */ jsxs(Field, { className, children: [
|
|
34
|
+
label && /* @__PURE__ */ jsx(FieldLabel, { children: label }),
|
|
35
35
|
/* @__PURE__ */ jsxs(
|
|
36
36
|
"div",
|
|
37
37
|
{
|
|
@@ -40,13 +40,7 @@ const CopyField = ({ value, label, description, mono = true, className }) => {
|
|
|
40
40
|
"transition-colors focus-within:border-ring focus-within:ring-1 focus-within:ring-ring hover:border-ring/60"
|
|
41
41
|
),
|
|
42
42
|
children: [
|
|
43
|
-
/* @__PURE__ */ jsx(
|
|
44
|
-
"span",
|
|
45
|
-
{
|
|
46
|
-
className: cn("min-w-0 flex-1 select-all break-all text-sm", mono && "font-mono"),
|
|
47
|
-
children: value
|
|
48
|
-
}
|
|
49
|
-
),
|
|
43
|
+
/* @__PURE__ */ jsx("span", { className: cn("min-w-0 flex-1 select-all break-all text-sm", mono && "font-mono"), children: value }),
|
|
50
44
|
/* @__PURE__ */ jsx(Tooltip, { content: copied ? "Copied" : "Copy", children: /* @__PURE__ */ jsx(
|
|
51
45
|
Button,
|
|
52
46
|
{
|
|
@@ -62,7 +56,7 @@ const CopyField = ({ value, label, description, mono = true, className }) => {
|
|
|
62
56
|
]
|
|
63
57
|
}
|
|
64
58
|
),
|
|
65
|
-
description && /* @__PURE__ */ jsx(FieldDescription, {
|
|
59
|
+
description && /* @__PURE__ */ jsx(FieldDescription, { children: description })
|
|
66
60
|
] });
|
|
67
61
|
};
|
|
68
62
|
CopyField.displayName = "CopyField";
|
package/dist/CopyField.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CopyField.js","sources":["../lib/components/CopyField/CopyField.tsx"],"sourcesContent":["import { Check, Copy } from 'lucide-react';\nimport type React from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { cn } from '../../../shadcn/utils';\nimport { Button } from '../Button';\nimport { FieldDescription, FieldLabel } from '../Field';\nimport { Tooltip } from '../Tooltip';\n\n/**\n * Props for the CopyField component\n */\nexport interface CopyFieldProps {\n /** The value shown and copied to the clipboard */\n value: string;\n /** Optional label rendered above the field; omit for a bare copy row */\n label?: React.ReactNode;\n /** Optional helper text rendered below the field */\n description?: React.ReactNode;\n /** Render the value in a monospace font (default: true) */\n mono?: boolean;\n /** Additional CSS classes applied to the field container */\n className?: string;\n}\n\n/**\n * CopyField renders a labeled, read-only value with an integrated copy-to-clipboard button.\n *\n * @example\n * ```tsx\n * <CopyField label=\"API Key\" value=\"sk_live_123\" />\n * ```\n */\nexport const CopyField: React.FC<CopyFieldProps> = ({ value, label, description, mono = true, className }) => {\n const [copied, setCopied] = useState(false);\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n // Clear any pending revert timer on unmount to avoid setting state on an unmounted component\n useEffect(\n () => () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n },\n [],\n );\n\n // Write the value to the clipboard and briefly show the copied confirmation\n const handleCopy = useCallback(async () => {\n try {\n await navigator.clipboard.writeText(value);\n setCopied(true);\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n timeoutRef.current = setTimeout(() => setCopied(false), 1500);\n } catch {\n // Clipboard access can be denied or unavailable; fail silently without breaking the UI\n }\n }, [value]);\n\n const ariaLabel = label ? `Copy ${typeof label === 'string' ? label : 'value'}` : 'Copy value';\n\n return (\n <
|
|
1
|
+
{"version":3,"file":"CopyField.js","sources":["../lib/components/CopyField/CopyField.tsx"],"sourcesContent":["import { Check, Copy } from 'lucide-react';\nimport type React from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { cn } from '../../../shadcn/utils';\nimport { Button } from '../Button';\nimport { Field, FieldDescription, FieldLabel } from '../Field';\nimport { Tooltip } from '../Tooltip';\n\n/**\n * Props for the CopyField component\n */\nexport interface CopyFieldProps {\n /** The value shown and copied to the clipboard */\n value: string;\n /** Optional label rendered above the field; omit for a bare copy row */\n label?: React.ReactNode;\n /** Optional helper text rendered below the field */\n description?: React.ReactNode;\n /** Render the value in a monospace font (default: true) */\n mono?: boolean;\n /** Additional CSS classes applied to the field container */\n className?: string;\n}\n\n/**\n * CopyField renders a labeled, read-only value with an integrated copy-to-clipboard button.\n *\n * @example\n * ```tsx\n * <CopyField label=\"API Key\" value=\"sk_live_123\" />\n * ```\n */\nexport const CopyField: React.FC<CopyFieldProps> = ({ value, label, description, mono = true, className }) => {\n const [copied, setCopied] = useState(false);\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n // Clear any pending revert timer on unmount to avoid setting state on an unmounted component\n useEffect(\n () => () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n },\n [],\n );\n\n // Write the value to the clipboard and briefly show the copied confirmation\n const handleCopy = useCallback(async () => {\n try {\n await navigator.clipboard.writeText(value);\n setCopied(true);\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n timeoutRef.current = setTimeout(() => setCopied(false), 1500);\n } catch {\n // Clipboard access can be denied or unavailable; fail silently without breaking the UI\n }\n }, [value]);\n\n const ariaLabel = label ? `Copy ${typeof label === 'string' ? label : 'value'}` : 'Copy value';\n\n return (\n <Field className={className}>\n {label && <FieldLabel>{label}</FieldLabel>}\n <div\n className={cn(\n 'group flex items-center gap-2 rounded-md border border-border bg-secondary pl-3 pr-1 py-1',\n 'transition-colors focus-within:border-ring focus-within:ring-1 focus-within:ring-ring hover:border-ring/60',\n )}\n >\n <span className={cn('min-w-0 flex-1 select-all break-all text-sm', mono && 'font-mono')}>{value}</span>\n <Tooltip content={copied ? 'Copied' : 'Copy'}>\n <Button\n type=\"button\"\n variant=\"ghost\"\n size=\"icon\"\n aria-label={ariaLabel}\n onClick={handleCopy}\n className=\"size-7 shrink-0 text-muted-foreground hover:text-foreground\"\n >\n {copied ? <Check className=\"size-4 text-success\" /> : <Copy className=\"size-4\" />}\n </Button>\n </Tooltip>\n </div>\n {description && <FieldDescription>{description}</FieldDescription>}\n </Field>\n );\n};\n\nCopyField.displayName = 'CopyField';\n"],"names":[],"mappings":";;;;;;;;;AAgCO,MAAM,SAAA,GAAsC,CAAC,EAAE,KAAA,EAAO,OAAO,WAAA,EAAa,IAAA,GAAO,IAAA,EAAM,SAAA,EAAU,KAAM;AAC5G,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAS,KAAK,CAAA;AAC1C,EAAA,MAAM,UAAA,GAAa,OAA6C,IAAI,CAAA;AAGpE,EAAA,SAAA;AAAA,IACE,MAAM,MAAM;AACV,MAAA,IAAI,WAAW,OAAA,EAAS;AACtB,QAAA,YAAA,CAAa,WAAW,OAAO,CAAA;AAAA,MACjC;AAAA,IACF,CAAA;AAAA,IACA;AAAC,GACH;AAGA,EAAA,MAAM,UAAA,GAAa,YAAY,YAAY;AACzC,IAAA,IAAI;AACF,MAAA,MAAM,SAAA,CAAU,SAAA,CAAU,SAAA,CAAU,KAAK,CAAA;AACzC,MAAA,SAAA,CAAU,IAAI,CAAA;AACd,MAAA,IAAI,WAAW,OAAA,EAAS;AACtB,QAAA,YAAA,CAAa,WAAW,OAAO,CAAA;AAAA,MACjC;AACA,MAAA,UAAA,CAAW,UAAU,UAAA,CAAW,MAAM,SAAA,CAAU,KAAK,GAAG,IAAI,CAAA;AAAA,IAC9D,CAAA,CAAA,MAAQ;AAAA,IAER;AAAA,EACF,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,MAAM,SAAA,GAAY,QAAQ,CAAA,KAAA,EAAQ,OAAO,UAAU,QAAA,GAAW,KAAA,GAAQ,OAAO,CAAA,CAAA,GAAK,YAAA;AAElF,EAAA,uBACE,IAAA,CAAC,SAAM,SAAA,EACJ,QAAA,EAAA;AAAA,IAAA,KAAA,oBAAS,GAAA,CAAC,cAAY,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,oBAC7B,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,EAAA;AAAA,UACT,2FAAA;AAAA,UACA;AAAA,SACF;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,UAAK,SAAA,EAAW,EAAA,CAAG,+CAA+C,IAAA,IAAQ,WAAW,GAAI,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,0BAChG,GAAA,CAAC,OAAA,EAAA,EAAQ,OAAA,EAAS,MAAA,GAAS,WAAW,MAAA,EACpC,QAAA,kBAAA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,QAAA;AAAA,cACL,OAAA,EAAQ,OAAA;AAAA,cACR,IAAA,EAAK,MAAA;AAAA,cACL,YAAA,EAAY,SAAA;AAAA,cACZ,OAAA,EAAS,UAAA;AAAA,cACT,SAAA,EAAU,6DAAA;AAAA,cAET,QAAA,EAAA,MAAA,uBAAU,KAAA,EAAA,EAAM,SAAA,EAAU,uBAAsB,CAAA,mBAAK,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,QAAA,EAAS;AAAA;AAAA,WACjF,EACF;AAAA;AAAA;AAAA,KACF;AAAA,IACC,WAAA,oBAAe,GAAA,CAAC,gBAAA,EAAA,EAAkB,QAAA,EAAA,WAAA,EAAY;AAAA,GAAA,EACjD,CAAA;AAEJ;AAEA,SAAA,CAAU,WAAA,GAAc,WAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CopyField.d.ts","sourceRoot":"","sources":["../../../../lib/components/CopyField/CopyField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,MAAM,WAAW,cAAc;IAE7B,KAAK,EAAE,MAAM,CAAC;IAEd,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE9B,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,
|
|
1
|
+
{"version":3,"file":"CopyField.d.ts","sourceRoot":"","sources":["../../../../lib/components/CopyField/CopyField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,MAAM,WAAW,cAAc;IAE7B,KAAK,EAAE,MAAM,CAAC;IAEd,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE9B,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAwD9C,CAAC"}
|