@flamingo-stack/openframe-frontend-core 0.0.684 → 0.0.685-2452.7452.1
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/{chunk-T6KWNJDW.js → chunk-22RSJ57Z.js} +470 -465
- package/dist/chunk-22RSJ57Z.js.map +1 -0
- package/dist/{chunk-K2HZG4RM.cjs → chunk-2OD2PPNO.cjs} +32 -32
- package/dist/{chunk-K2HZG4RM.cjs.map → chunk-2OD2PPNO.cjs.map} +1 -1
- package/dist/{chunk-QFJHEDZV.js → chunk-3NY5ILEE.js} +3 -3
- package/dist/{chunk-QMUALBRX.js → chunk-4A5PYSPH.js} +6 -5
- package/dist/{chunk-QMUALBRX.js.map → chunk-4A5PYSPH.js.map} +1 -1
- package/dist/{chunk-CHFHYEZR.js → chunk-5QXN54QK.js} +3 -3
- package/dist/{chunk-6T4RTIW6.cjs → chunk-7CTJLBZM.cjs} +5 -5
- package/dist/{chunk-6T4RTIW6.cjs.map → chunk-7CTJLBZM.cjs.map} +1 -1
- package/dist/{chunk-ZYHN5ABN.js → chunk-7GKYMBQ4.js} +4 -4
- package/dist/{chunk-GJ7UAN7G.js → chunk-AELY4TAA.js} +3 -3
- package/dist/{chunk-SHNSCUIR.cjs → chunk-AKFA7ZDD.cjs} +28 -28
- package/dist/{chunk-SHNSCUIR.cjs.map → chunk-AKFA7ZDD.cjs.map} +1 -1
- package/dist/{chunk-PUZQENGY.js → chunk-BYG2NLD7.js} +3 -3
- package/dist/{chunk-VW4JDXAT.js → chunk-EXZPVTUM.js} +2086 -1644
- package/dist/chunk-EXZPVTUM.js.map +1 -0
- package/dist/{chunk-XQXIFRFQ.js → chunk-FTPDLV7B.js} +4 -4
- package/dist/{chunk-WCZJQIDW.js → chunk-G6G6R3HQ.js} +3 -3
- package/dist/{chunk-4IRROD7M.cjs → chunk-H5JOWXGI.cjs} +30 -30
- package/dist/{chunk-4IRROD7M.cjs.map → chunk-H5JOWXGI.cjs.map} +1 -1
- package/dist/{chunk-TUG7IT6H.js → chunk-HLEXYTOE.js} +2 -2
- package/dist/{chunk-UHLN2S7J.cjs → chunk-HTIOL44C.cjs} +1247 -805
- package/dist/chunk-HTIOL44C.cjs.map +1 -0
- package/dist/{chunk-777QY5YZ.cjs → chunk-ILMGYP66.cjs} +3 -3
- package/dist/{chunk-777QY5YZ.cjs.map → chunk-ILMGYP66.cjs.map} +1 -1
- package/dist/{chunk-7GSLZBGB.cjs → chunk-JEEYLBPQ.cjs} +10 -10
- package/dist/{chunk-7GSLZBGB.cjs.map → chunk-JEEYLBPQ.cjs.map} +1 -1
- package/dist/{chunk-KSZBUUTY.js → chunk-KLWCURLZ.js} +6 -6
- package/dist/{chunk-7HROJ2CB.cjs → chunk-KVOA22BW.cjs} +81 -81
- package/dist/{chunk-7HROJ2CB.cjs.map → chunk-KVOA22BW.cjs.map} +1 -1
- package/dist/{chunk-FVEQYZDH.js → chunk-L5OLMZGC.js} +7 -7
- package/dist/{chunk-64MGLDCX.cjs → chunk-LSY7OGTC.cjs} +384 -383
- package/dist/chunk-LSY7OGTC.cjs.map +1 -0
- package/dist/{chunk-J5CGC6ES.cjs → chunk-MGYWANYK.cjs} +12 -12
- package/dist/{chunk-J5CGC6ES.cjs.map → chunk-MGYWANYK.cjs.map} +1 -1
- package/dist/{chunk-E3G22CS7.cjs → chunk-OFYXFNVF.cjs} +33 -33
- package/dist/{chunk-E3G22CS7.cjs.map → chunk-OFYXFNVF.cjs.map} +1 -1
- package/dist/{chunk-DJ5UHDWB.cjs → chunk-OIAI5J35.cjs} +59 -59
- package/dist/{chunk-DJ5UHDWB.cjs.map → chunk-OIAI5J35.cjs.map} +1 -1
- package/dist/{chunk-DQOQ3KTP.cjs → chunk-QNWQQ4RT.cjs} +78 -73
- package/dist/chunk-QNWQQ4RT.cjs.map +1 -0
- package/dist/{chunk-5GMTMALA.js → chunk-ROOCATH7.js} +6 -6
- package/dist/{chunk-7MCK6KMW.js → chunk-RXFHPJ5O.js} +5 -5
- package/dist/{chunk-P7TNZJBZ.cjs → chunk-SO5NWQMG.cjs} +6 -6
- package/dist/{chunk-P7TNZJBZ.cjs.map → chunk-SO5NWQMG.cjs.map} +1 -1
- package/dist/{chunk-B5JLPHHE.js → chunk-THLCPUEG.js} +2 -2
- package/dist/{chunk-WA4O5ILG.js → chunk-TKRGKDNG.js} +5 -5
- package/dist/{chunk-KCEACU3F.js → chunk-URJD7BME.js} +3 -3
- package/dist/{chunk-OKXB2A2F.cjs → chunk-UU7NOXIK.cjs} +7 -7
- package/dist/{chunk-OKXB2A2F.cjs.map → chunk-UU7NOXIK.cjs.map} +1 -1
- package/dist/{chunk-CZUO5KVD.cjs → chunk-XWP5E453.cjs} +20 -20
- package/dist/{chunk-CZUO5KVD.cjs.map → chunk-XWP5E453.cjs.map} +1 -1
- package/dist/{chunk-ERTG6C5E.cjs → chunk-YTVZJNJ7.cjs} +22 -22
- package/dist/{chunk-ERTG6C5E.cjs.map → chunk-YTVZJNJ7.cjs.map} +1 -1
- package/dist/{chunk-VNNEAPXL.cjs → chunk-YVARUYL5.cjs} +15 -15
- package/dist/{chunk-VNNEAPXL.cjs.map → chunk-YVARUYL5.cjs.map} +1 -1
- package/dist/components/case-studies/index.cjs +16 -16
- package/dist/components/case-studies/index.js +4 -4
- package/dist/components/chat/ai-assistant-info.d.ts.map +1 -1
- package/dist/components/chat/approval-request-message.d.ts.map +1 -1
- package/dist/components/chat/chat-appearance-context.d.ts +9 -0
- package/dist/components/chat/chat-appearance-context.d.ts.map +1 -0
- package/dist/components/chat/chat-input.d.ts.map +1 -1
- package/dist/components/chat/chat-message-enhanced.d.ts.map +1 -1
- package/dist/components/chat/chat-message-list.d.ts.map +1 -1
- package/dist/components/chat/chat-nav-sidebar.d.ts +50 -0
- package/dist/components/chat/chat-nav-sidebar.d.ts.map +1 -0
- package/dist/components/chat/chat-top-navigation.d.ts +29 -0
- package/dist/components/chat/chat-top-navigation.d.ts.map +1 -0
- package/dist/components/chat/error-message-display.d.ts.map +1 -1
- package/dist/components/chat/index.cjs +21 -3
- package/dist/components/chat/index.cjs.map +1 -1
- package/dist/components/chat/index.d.ts +6 -0
- package/dist/components/chat/index.d.ts.map +1 -1
- package/dist/components/chat/index.js +20 -2
- package/dist/components/chat/msp-organization-card.d.ts +7 -1
- package/dist/components/chat/msp-organization-card.d.ts.map +1 -1
- package/dist/components/chat/onboarding-carousel.d.ts +29 -0
- package/dist/components/chat/onboarding-carousel.d.ts.map +1 -0
- package/dist/components/chat/system-event-message.d.ts +14 -0
- package/dist/components/chat/system-event-message.d.ts.map +1 -0
- package/dist/components/chat/types/chat.types.d.ts +13 -0
- package/dist/components/chat/types/chat.types.d.ts.map +1 -1
- package/dist/components/chat/types/component.types.d.ts +20 -1
- package/dist/components/chat/types/component.types.d.ts.map +1 -1
- package/dist/components/contact/index.cjs +5 -5
- package/dist/components/contact/index.js +4 -4
- package/dist/components/docs/index.cjs +8 -8
- package/dist/components/docs/index.js +7 -7
- package/dist/components/embeds/index.cjs +5 -5
- package/dist/components/embeds/index.js +4 -4
- package/dist/components/faq/index.cjs +5 -5
- package/dist/components/faq/index.js +4 -4
- package/dist/components/features/index.cjs +4 -4
- package/dist/components/features/index.js +3 -3
- package/dist/components/help-center-pages/index.cjs +91 -91
- package/dist/components/help-center-pages/index.js +15 -15
- package/dist/components/index.cjs +73 -55
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.js +33 -15
- package/dist/components/index.js.map +1 -1
- package/dist/components/meeting-scheduler/index.cjs +41 -41
- package/dist/components/meeting-scheduler/index.js +3 -3
- package/dist/components/navigation/index.cjs +7 -7
- package/dist/components/navigation/index.js +6 -6
- package/dist/components/onboarding-guides/index.cjs +7 -7
- package/dist/components/onboarding-guides/index.js +6 -6
- package/dist/components/related-content/index.cjs +3 -3
- package/dist/components/related-content/index.js +2 -2
- package/dist/components/tickets/index.cjs +8 -8
- package/dist/components/tickets/index.js +7 -7
- package/dist/components/ui/avatar-stack.d.ts +5 -1
- package/dist/components/ui/avatar-stack.d.ts.map +1 -1
- package/dist/components/ui/index.cjs +22 -4
- package/dist/components/ui/index.cjs.map +1 -1
- package/dist/components/ui/index.js +21 -3
- package/dist/components/ui/reopen-ticket-request-modal.d.ts +4 -1
- package/dist/components/ui/reopen-ticket-request-modal.d.ts.map +1 -1
- package/dist/index.cjs +27 -9
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +25 -7
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/chat/__tests__/chat-appearance.test.tsx +79 -0
- package/src/components/chat/__tests__/onboarding-carousel.test.tsx +56 -0
- package/src/components/chat/ai-assistant-info.tsx +7 -1
- package/src/components/chat/approval-request-message.tsx +6 -1
- package/src/components/chat/chat-appearance-context.tsx +15 -0
- package/src/components/chat/chat-input.tsx +26 -1
- package/src/components/chat/chat-message-enhanced.tsx +180 -142
- package/src/components/chat/chat-message-list.tsx +169 -164
- package/src/components/chat/chat-nav-sidebar.tsx +163 -0
- package/src/components/chat/chat-top-navigation.tsx +109 -0
- package/src/components/chat/error-message-display.tsx +21 -3
- package/src/components/chat/index.ts +6 -0
- package/src/components/chat/msp-organization-card.tsx +35 -0
- package/src/components/chat/onboarding-carousel.tsx +162 -0
- package/src/components/chat/system-event-message.tsx +54 -0
- package/src/components/chat/types/chat.types.ts +15 -0
- package/src/components/chat/types/component.types.ts +20 -0
- package/src/components/ui/__tests__/avatar-stack.test.tsx +25 -0
- package/src/components/ui/avatar-stack.tsx +15 -5
- package/src/components/ui/reopen-ticket-request-modal.tsx +6 -2
- package/src/stories/FaeLayoutV2.stories.tsx +150 -0
- package/src/stories/FaeOnboardingV2.stories.tsx +68 -0
- package/src/stories/FaeThreadV2.stories.tsx +192 -0
- package/src/stories/fae-brand-decorator.tsx +28 -0
- package/src/styles/ods-colors.css +10 -0
- package/src/styles/ods-effects.css +13 -0
- package/dist/chunk-64MGLDCX.cjs.map +0 -1
- package/dist/chunk-DQOQ3KTP.cjs.map +0 -1
- package/dist/chunk-T6KWNJDW.js.map +0 -1
- package/dist/chunk-UHLN2S7J.cjs.map +0 -1
- package/dist/chunk-VW4JDXAT.js.map +0 -1
- /package/dist/{chunk-QFJHEDZV.js.map → chunk-3NY5ILEE.js.map} +0 -0
- /package/dist/{chunk-CHFHYEZR.js.map → chunk-5QXN54QK.js.map} +0 -0
- /package/dist/{chunk-ZYHN5ABN.js.map → chunk-7GKYMBQ4.js.map} +0 -0
- /package/dist/{chunk-GJ7UAN7G.js.map → chunk-AELY4TAA.js.map} +0 -0
- /package/dist/{chunk-PUZQENGY.js.map → chunk-BYG2NLD7.js.map} +0 -0
- /package/dist/{chunk-XQXIFRFQ.js.map → chunk-FTPDLV7B.js.map} +0 -0
- /package/dist/{chunk-WCZJQIDW.js.map → chunk-G6G6R3HQ.js.map} +0 -0
- /package/dist/{chunk-TUG7IT6H.js.map → chunk-HLEXYTOE.js.map} +0 -0
- /package/dist/{chunk-KSZBUUTY.js.map → chunk-KLWCURLZ.js.map} +0 -0
- /package/dist/{chunk-FVEQYZDH.js.map → chunk-L5OLMZGC.js.map} +0 -0
- /package/dist/{chunk-5GMTMALA.js.map → chunk-ROOCATH7.js.map} +0 -0
- /package/dist/{chunk-7MCK6KMW.js.map → chunk-RXFHPJ5O.js.map} +0 -0
- /package/dist/{chunk-B5JLPHHE.js.map → chunk-THLCPUEG.js.map} +0 -0
- /package/dist/{chunk-WA4O5ILG.js.map → chunk-TKRGKDNG.js.map} +0 -0
- /package/dist/{chunk-KCEACU3F.js.map → chunk-URJD7BME.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-CZUO5KVD.cjs","../src/components/platform/SoftwareInfo.tsx","../src/components/platform/SoftwareSourceBadge.tsx","../src/components/platform/CveLink.tsx","../src/components/platform/ToolBadge.tsx","../src/components/platform/ShellTypeBadge.tsx","../src/components/platform/ScriptInfoSection.tsx","../src/components/platform/ScriptArguments.tsx","../src/components/shared/onboarding/onboarding-step-card.tsx","../src/components/shared/onboarding/onboarding-walkthrough.tsx"],"names":["jsx","jsxs","cn","Fragment"],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-CZUO5KVD.cjs","sourcesContent":[null,"/**\n * SoftwareInfo Component\n *\n * Displays software name with optional vendor information below it.\n * Part of the ODS (OpenFrame Design System) platform components.\n *\n * @example\n * ```tsx\n * <SoftwareInfo name=\"Visual Studio Code\" vendor=\"Microsoft\" />\n * <SoftwareInfo name=\"Chrome\" /> // Without vendor\n * ```\n */\n\nimport type React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface SoftwareInfoProps {\n /** Software name (required) */\n name: string;\n /** Software vendor (optional) */\n vendor?: string;\n /** Software version (optional) */\n version?: string;\n /** Additional CSS classes */\n className?: string;\n}\n\nexport const SoftwareInfo: React.FC<SoftwareInfoProps> = ({ name, vendor, version, className }) => {\n return (\n <div className={cn('flex flex-col gap-1', className)}>\n <div className=\"flex items-center gap-2\">\n <div className=\"text-ods-text-primary text-h4\">{name}</div>\n {version && (\n <div className=\"rounded bg-ods-bg-surface px-2 py-1 text-ods-text-secondary text-h6\">{version}</div>\n )}\n </div>\n {vendor && <div className=\"text-ods-text-secondary text-h6\">{vendor}</div>}\n </div>\n );\n};\n\nSoftwareInfo.displayName = 'SoftwareInfo';\n","/**\n * SoftwareSourceBadge Component\n *\n * Displays a badge for software source types from Fleet MDM.\n * Supports all osquery software source types with appropriate styling.\n *\n * Fleet MDM Software Sources:\n * - apps: macOS Applications\n * - chrome_extensions: Chrome Browser Extensions\n * - firefox_addons: Firefox Browser Extensions\n * - safari_extensions: Safari Browser Extensions\n * - ie_extensions: Internet Explorer Extensions\n * - vscode_extensions: VS Code Extensions\n * - atom_packages: Atom Packages\n * - homebrew_packages: Homebrew Packages (macOS)\n * - npm_packages: NPM Packages\n * - python_packages: Python Packages\n * - apt_sources: APT Packages (Debian/Ubuntu)\n * - deb_packages: DEB Packages\n * - rpm_packages: RPM Packages (Red Hat/CentOS)\n * - yum_sources: YUM Packages\n * - portage_packages: Portage Packages (Gentoo)\n * - chocolatey_packages: Chocolatey Packages (Windows)\n * - programs: Windows Programs\n * - pkg_packages: PKG Packages\n *\n * @example\n * ```tsx\n * <SoftwareSourceBadge source=\"apps\" />\n * <SoftwareSourceBadge source=\"chrome_extensions\" />\n * <SoftwareSourceBadge source=\"python_packages\" />\n * ```\n */\n\nimport type React from 'react';\nimport { cn } from '../../utils/common';\nimport { PackageIcon, WindowsIcon, MacOSIcon, LinuxIcon } from '../icons';\n\nexport type SoftwareSource =\n | 'apps'\n | 'chrome_extensions'\n | 'firefox_addons'\n | 'safari_extensions'\n | 'ie_extensions'\n | 'vscode_extensions'\n | 'atom_packages'\n | 'homebrew_packages'\n | 'npm_packages'\n | 'python_packages'\n | 'apt_sources'\n | 'deb_packages'\n | 'rpm_packages'\n | 'yum_sources'\n | 'portage_packages'\n | 'chocolatey_packages'\n | 'programs'\n | 'pkg_packages';\n\nexport interface SoftwareSourceBadgeProps {\n /** Software source type from Fleet MDM */\n source: SoftwareSource;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Maps source types to human-readable labels and icons\n */\nconst sourceConfig: Record<SoftwareSource, { label: string; icon: React.ReactNode }> = {\n apps: { label: 'App', icon: <MacOSIcon className=\"h-4 w-4\" /> },\n chrome_extensions: { label: 'Chrome', icon: <PackageIcon className=\"h-4 w-4\" /> },\n firefox_addons: { label: 'Firefox', icon: <PackageIcon className=\"h-4 w-4\" /> },\n safari_extensions: { label: 'Safari', icon: <PackageIcon className=\"h-4 w-4\" /> },\n ie_extensions: { label: 'IE', icon: <PackageIcon className=\"h-4 w-4\" /> },\n vscode_extensions: { label: 'VS Code', icon: <PackageIcon className=\"h-4 w-4\" /> },\n atom_packages: { label: 'Atom', icon: <PackageIcon className=\"h-4 w-4\" /> },\n homebrew_packages: { label: 'Homebrew', icon: <MacOSIcon className=\"h-4 w-4\" /> },\n npm_packages: { label: 'NPM', icon: <PackageIcon className=\"h-4 w-4\" /> },\n python_packages: { label: 'Python', icon: <PackageIcon className=\"h-4 w-4\" /> },\n apt_sources: { label: 'APT', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n deb_packages: { label: 'DEB', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n rpm_packages: { label: 'RPM', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n yum_sources: { label: 'YUM', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n portage_packages: { label: 'Portage', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n chocolatey_packages: { label: 'Chocolatey', icon: <WindowsIcon className=\"h-4 w-4\" /> },\n programs: { label: 'Windows', icon: <WindowsIcon className=\"h-4 w-4\" /> },\n pkg_packages: { label: 'PKG', icon: <PackageIcon className=\"h-4 w-4\" /> },\n};\n\nexport const SoftwareSourceBadge: React.FC<SoftwareSourceBadgeProps> = ({ source, className }) => {\n const config = sourceConfig[source] || { label: source, icon: <PackageIcon className=\"h-4 w-4\" /> };\n\n return (\n <span className={cn('inline-flex items-center gap-2 text-ods-text-primary', className)}>\n {config.icon}\n {config.label}\n </span>\n );\n};\n\nSoftwareSourceBadge.displayName = 'SoftwareSourceBadge';\n","/**\n * CveLink Component\n *\n * Displays a CVE ID with an external link icon that links to the NIST NVD database.\n * Part of the ODS (OpenFrame Design System) platform components.\n *\n * @example\n * ```tsx\n * <CveLink cveId=\"CVE-2024-1234\" />\n * ```\n */\n\nimport type React from 'react';\nimport { cn } from '../../utils/cn';\nimport { CustomExternalLinkIcon } from '../icons';\n\nexport interface CveLinkProps {\n /** CVE ID (e.g., \"CVE-2024-1234\") */\n cveId: string;\n /** Additional CSS classes */\n className?: string;\n}\n\nexport const CveLink: React.FC<CveLinkProps> = ({ cveId, className }) => {\n const nistUrl = `https://nvd.nist.gov/vuln/detail/${cveId}`;\n\n return (\n <a\n href={nistUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={cn(\n 'group inline-flex items-center gap-2 text-ods-text-primary transition-colors text-code hover:text-ods-accent',\n className,\n )}\n >\n <span>{cveId}</span>\n <CustomExternalLinkIcon className=\"h-4 w-4 text-ods-text-secondary transition-colors group-hover:text-ods-accent\" />\n </a>\n );\n};\n\nCveLink.displayName = 'CveLink';\n","/**\n * ToolBadge Component\n *\n * Displays a tool type badge with icon for OpenFrame integrated tools.\n * Used in tables to show tool sources like Fleet MDM, MeshCentral, etc.\n *\n * @example\n * ```tsx\n * <ToolBadge toolType=\"OPENFRAME_RMM\" />\n * <ToolBadge toolType=\"FLEET\" />\n * <ToolBadge toolType=\"MESHCENTRAL\" />\n * ```\n */\n\nimport type React from 'react';\nimport type { ToolType } from '../../types/tool.types';\nimport { cn } from '../../utils/cn';\nimport { getToolLabel } from '../../utils/tool-utils';\nimport { ToolIcon } from '../tool-icon';\n\nexport type { ToolType } from '../../types/tool.types';\n\nexport interface ToolBadgeProps {\n /** Tool type */\n toolType: ToolType;\n /** Additional CSS classes */\n className?: string;\n iconClassName?: string;\n}\n\nexport const ToolBadge: React.FC<ToolBadgeProps> = ({ toolType, className, iconClassName }) => {\n const label = getToolLabel(toolType);\n\n return (\n <div className={cn('flex items-center gap-1 text-ods-text-secondary', className)}>\n <ToolIcon toolType={toolType} className={iconClassName} size={16} />\n <span className=\"text-ods-text-primary text-h4\">{label}</span>\n </div>\n );\n};\n\nToolBadge.displayName = 'ToolBadge';\n","/**\n * ShellTypeBadge Component\n *\n * Displays a badge for shell/script types with appropriate icon and label.\n * Supports all RMM shell types.\n */\n\nimport type React from 'react';\nimport { type ShellType, ShellTypeValues } from '../../types/shell.types';\nimport { cn } from '../../utils/cn';\nimport { getShellLabel } from '../../utils/shell-utils';\nimport { BashIcon, CmdIcon, DenoIcon, NushellIcon, ShellIcon } from '../icons';\nimport { PowershellLogoGreyIcon } from '../icons-v2-generated/brand-logos/powershell-logo-grey-icon';\nimport { PythonLogoIcon } from '../icons-v2-generated/brand-logos/python-logo-icon';\n\n/**\n * Shell icon configuration with typed mapping\n */\ninterface ShellIconConfig {\n icon: React.ComponentType<{ size?: number; color?: string; className?: string }>;\n props: { size: number } & ({ className: string } | { color: string });\n}\n\n/**\n * Typed mapping of shell types to their icon configurations\n * Using Record<ShellType, ...> ensures all shell types are covered\n */\nconst shellIconMap: Record<ShellType, ShellIconConfig> = {\n [ShellTypeValues.POWERSHELL]: {\n icon: PowershellLogoGreyIcon,\n props: { size: 16, className: 'text-ods-text-secondary' },\n },\n [ShellTypeValues.CMD]: {\n icon: CmdIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n [ShellTypeValues.BASH]: {\n icon: BashIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n [ShellTypeValues.PYTHON]: {\n icon: PythonLogoIcon,\n props: { size: 16, className: 'text-ods-text-secondary' },\n },\n [ShellTypeValues.NUSHELL]: {\n icon: NushellIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n [ShellTypeValues.DENO]: {\n icon: DenoIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n [ShellTypeValues.SHELL]: {\n icon: ShellIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n} as const;\n\nconst defaultIconConfig: ShellIconConfig = {\n icon: ShellIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n};\n\nexport interface ShellTypeBadgeProps {\n shellType: ShellType;\n className?: string;\n iconClassName?: string;\n}\n\nexport const ShellTypeBadge: React.FC<ShellTypeBadgeProps> = ({ shellType, className, iconClassName }) => {\n const normalizedType = shellType?.toUpperCase() as ShellType;\n const label = getShellLabel(normalizedType);\n const { icon: IconComponent, props: iconProps } = shellIconMap[normalizedType] ?? defaultIconConfig;\n const defaultIconClassName = 'className' in iconProps ? iconProps.className : undefined;\n\n return (\n <div className={cn('flex items-center gap-1', className)}>\n <IconComponent size={16} className={cn(defaultIconClassName, iconClassName)} />\n <span className=\"text-ods-text-primary text-h4\">{label}</span>\n </div>\n );\n};\n\nShellTypeBadge.displayName = 'ShellTypeBadge';\n","/**\n * ScriptInfoSection Component\n *\n * Displays script information in a card with header (title, description)\n * and detail cells (shell type, supported platforms, category, author).\n * Responsive layout: stacks cells on mobile, shows grid on desktop.\n */\n\nimport type React from 'react';\nimport Image from '../../embed-shims/next-image';\nimport { cn } from '../../utils/cn';\nimport { nameInitials } from '../../utils/format';\nimport { getOSLabel } from '../../utils/os-utils';\nimport { getShellLabel } from '../../utils/shell-utils';\n\n/**\n * Props for author avatar display\n */\nexport interface ScriptAuthor {\n /** Author name */\n name: string;\n /** Author initials (used when no photo) */\n initials?: string;\n /** URL to author's photo */\n photoUrl?: string;\n}\n\n/**\n * Props for ScriptInfoSection component\n */\nexport interface ScriptInfoSectionProps {\n /** Script title/name */\n headline: string;\n /** Script description */\n subheadline?: string;\n /** Shell type (POWERSHELL, BASH, CMD, etc.) */\n shellType?: string;\n /** Array of supported platform strings (windows, darwin, linux, etc.) */\n supportedPlatforms?: string[];\n /** Script category */\n category: string;\n /** Author information */\n author?: ScriptAuthor;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Formats supported platforms array into a display string\n * @param platforms - Array of platform strings (e.g., ['windows', 'darwin', 'linux'])\n * @returns Formatted string (e.g., 'Windows, macOS, Linux')\n */\nfunction formatSupportedPlatforms(platforms?: string[]): string {\n if (!platforms || platforms.length === 0) {\n return 'All Platforms';\n }\n return platforms.map(platform => getOSLabel(platform)).join(', ');\n}\n\n/**\n * InfoCell - Single info cell with label and value\n */\ninterface InfoCellProps {\n label: string;\n value: string;\n avatar?: ScriptAuthor;\n className?: string;\n}\n\nfunction InfoCell({ label, value, avatar, className }: InfoCellProps) {\n return (\n <div className={cn('flex min-w-0 items-center gap-2', className)}>\n {/* Avatar for author cell */}\n {avatar && (\n <div className=\"relative size-8 shrink-0 overflow-hidden rounded-full border border-ods-border bg-ods-bg\">\n {avatar.photoUrl ? (\n <Image src={avatar.photoUrl} alt={avatar.name} className=\"object-cover\" fill sizes=\"32px\" unoptimized />\n ) : (\n <div className=\"flex size-full items-center justify-center text-ods-text-secondary text-h6\">\n {avatar.initials || nameInitials(avatar.name)}\n </div>\n )}\n </div>\n )}\n\n {/* Text content */}\n <div className=\"flex min-w-0 flex-col\">\n <span className=\"truncate text-ods-text-primary text-h4\" title={value}>\n {value}\n </span>\n <span className=\"truncate text-ods-text-secondary text-h6\">{label}</span>\n </div>\n </div>\n );\n}\n\n/**\n * ScriptInfoSection - Displays script information in a structured card\n *\n * @example\n * ```tsx\n * <ScriptInfoSection\n * title=\"System Backup Script\"\n * description=\"Comprehensive Linux system backup script...\"\n * shellType=\"BASH\"\n * supportedPlatforms={['linux']}\n * category=\"System Maintenance\"\n * author={{ name: 'John Doe', photoUrl: '/avatars/john.jpg' }}\n * />\n * ```\n */\nexport const ScriptInfoSection: React.FC<ScriptInfoSectionProps> = ({\n headline,\n subheadline,\n shellType,\n supportedPlatforms,\n category,\n author,\n className,\n}) => {\n const shellLabel = getShellLabel(shellType);\n const platformsLabel = formatSupportedPlatforms(supportedPlatforms);\n\n return (\n <div className={cn('overflow-hidden rounded-[6px] border border-ods-border bg-ods-card', className)}>\n {/* Header row with title and description */}\n <div className=\"border-b border-ods-border p-4\">\n <div className=\"flex flex-col gap-1\">\n <h3 className=\"text-ods-text-primary text-h4\">{headline}</h3>\n {subheadline && <p className=\"break-words text-ods-text-secondary text-h6\">{subheadline}</p>}\n </div>\n </div>\n\n {/* Details section with info cells\n - Mobile/Tablet (<lg): 2x2 grid with divider between rows\n - Desktop (lg+): 4 columns in single row\n */}\n {/* First row: Shell Type, Supported Platforms */}\n <div className=\"grid grid-cols-2 gap-4 border-b border-ods-border px-4 py-4 lg:grid-cols-4 lg:border-b-0\">\n <InfoCell label=\"Shell Type\" value={shellLabel} />\n <InfoCell label=\"Supported Platforms\" value={platformsLabel} />\n {/* Desktop only: Category and Author in same row */}\n <InfoCell label=\"Category\" value={category} className=\"hidden lg:flex\" />\n {author && <InfoCell label=\"Added by\" value={author.name} avatar={author} className=\"hidden lg:flex\" />}\n </div>\n {/* Second row (mobile/tablet only): Category, Author */}\n <div className=\"grid grid-cols-2 gap-4 px-4 py-4 lg:hidden\">\n <InfoCell label=\"Category\" value={category} />\n {author && <InfoCell label=\"Added by\" value={author.name} avatar={author} />}\n </div>\n </div>\n );\n};\n\nScriptInfoSection.displayName = 'ScriptInfoSection';\n","/**\n * ScriptArguments Component\n *\n * Displays and manages script arguments as key-value pairs.\n * Each argument has a name (key) and value input field with delete button.\n * Includes an \"Add Script Argument\" button to add new entries.\n */\n\nimport { Trash2 } from 'lucide-react';\nimport type React from 'react';\nimport { cn } from '../../utils/cn';\nimport { LockIcon, PlusCircleIcon } from '../icons-v2-generated';\nimport { Button } from '../ui/button';\nimport { Input } from '../ui/input';\nimport { Label } from '../ui/label';\n\n/**\n * What an untouched stored secret shows in its value field.\n *\n * Rendered as the field's PLACEHOLDER, never as its value: a mask held in\n * `value` is indistinguishable from something the user typed, and would be\n * submitted back as the secret itself.\n */\nconst SECRET_MASK = '**********';\n\nconst STORED_SECRET_KEY_HINT = \"A stored secret can't be renamed — delete it and add a new one\";\n\n/**\n * Single script argument with key and value\n */\nexport interface ScriptArgument {\n /** Unique identifier for the argument */\n id: string;\n /** Argument name/key */\n key: string;\n /** Argument value (empty string for flag-type arguments) */\n value: string;\n /**\n * A secret pair: the key carries a lock and the value is typed as a password.\n * Meaningful for environment variables only.\n */\n secret?: boolean;\n /**\n * The server holds a value for this secret and does not send it back. While\n * `value` is empty the field shows a mask, so empty means \"keep what is\n * stored\" and typing replaces it.\n *\n * The stored value is bound to the key, which is therefore read-only:\n * renaming would leave the old name holding the secret and the new one\n * holding nothing.\n */\n hasStoredValue?: boolean;\n}\n\n/**\n * Props for ScriptArguments component\n */\nexport interface ScriptArgumentsProps {\n /** Array of script arguments */\n arguments: ScriptArgument[];\n /** Callback when arguments change */\n onArgumentsChange?: (args: ScriptArgument[]) => void;\n /** Placeholder for key input */\n keyPlaceholder?: string;\n /** Placeholder for value input */\n valuePlaceholder?: string;\n /** Label for the add button */\n addButtonLabel?: string;\n /** Label for a second add button that appends a secret pair. Omit to not offer secrets. */\n addSecretButtonLabel?: string;\n /** Whether the component is disabled */\n disabled?: boolean;\n /** Additional CSS classes */\n className?: string;\n /** Label for the title input */\n titleLabel: string;\n}\n\n/**\n * ScriptArguments - Displays and manages script arguments\n *\n * @example\n * ```tsx\n * <ScriptArguments\n * arguments={[\n * { id: '1', key: 'port', value: '3000' },\n * { id: '2', key: 'verbose', value: '' },\n * ]}\n * onArgumentsChange={(args) => setArguments(args)}\n * />\n * ```\n */\nexport const ScriptArguments: React.FC<ScriptArgumentsProps> = ({\n arguments: args,\n onArgumentsChange,\n keyPlaceholder = 'Enter Key',\n valuePlaceholder = 'Enter Value (empty=flag)',\n addButtonLabel = 'Add Script Argument',\n addSecretButtonLabel,\n disabled = false,\n className,\n titleLabel,\n}) => {\n const handleKeyChange = (id: string, newKey: string) => {\n if (!onArgumentsChange) return;\n const updated = args.map(arg => (arg.id === id ? { ...arg, key: newKey } : arg));\n onArgumentsChange(updated);\n };\n\n const handleValueChange = (id: string, newValue: string) => {\n if (!onArgumentsChange) return;\n const updated = args.map(arg => (arg.id === id ? { ...arg, value: newValue } : arg));\n onArgumentsChange(updated);\n };\n\n const handleDelete = (id: string) => {\n if (!onArgumentsChange) return;\n const updated = args.filter(arg => arg.id !== id);\n onArgumentsChange(updated);\n };\n\n const handleAdd = (secret = false) => {\n if (!onArgumentsChange) return;\n const newArg: ScriptArgument = {\n id: crypto.randomUUID(),\n key: '',\n value: '',\n // Only set on a secret, so a plain pair keeps the shape it always had.\n ...(secret && { secret: true }),\n };\n onArgumentsChange([...args, newArg]);\n };\n\n const isFirstRow = (index: number) => index === 0;\n\n return (\n <div className={cn('flex flex-col gap-2', className)}>\n {args.map((arg, index) => {\n const isStoredSecret = Boolean(arg.secret && arg.hasStoredValue);\n // The mask stands for the stored value, so it goes once the user types a replacement.\n const showsMask = isStoredSecret && !arg.value;\n\n return (\n <div key={arg.id} className=\"flex w-full items-end gap-2\">\n {/* Key input - with label only on first row */}\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n {isFirstRow(index) && <Label spacing=\"tight\">{titleLabel}</Label>}\n <Input\n value={arg.key}\n onChange={e => handleKeyChange(arg.id, e.target.value)}\n placeholder={keyPlaceholder}\n disabled={disabled}\n readOnly={isStoredSecret}\n title={isStoredSecret ? STORED_SECRET_KEY_HINT : undefined}\n startAdornment={arg.secret ? <LockIcon role=\"img\" aria-label=\"Secret\" /> : undefined}\n />\n </div>\n\n {/* Value input with delete button */}\n <div className=\"flex min-w-0 flex-1 items-center gap-2\">\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <Input\n // `new-password` keeps a password manager from filling a saved login into a secret.\n type={arg.secret ? 'password' : undefined}\n autoComplete={arg.secret ? 'new-password' : undefined}\n value={arg.value}\n onChange={e => handleValueChange(arg.id, e.target.value)}\n placeholder={showsMask ? SECRET_MASK : valuePlaceholder}\n disabled={disabled}\n className={cn(\n !arg.value && 'placeholder:text-ods-text-muted',\n // The mask reads as a value that is there, not as a prompt to fill one in.\n showsMask && '[&_input]:placeholder:text-ods-text-primary',\n )}\n />\n </div>\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"icon\"\n onClick={() => handleDelete(arg.id)}\n disabled={disabled}\n aria-label=\"Delete argument\"\n leftIcon={<Trash2 className=\"size-4 md:size-6\" color=\"var(--color-error)\" />}\n />\n </div>\n </div>\n );\n })}\n\n {/* Add buttons - aligned left */}\n <div className=\"flex flex-wrap justify-start gap-[var(--spacing-system-xs)]\">\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"small\"\n onClick={() => handleAdd()}\n disabled={disabled}\n className=\"self-start\"\n leftIcon={<PlusCircleIcon className=\"text-ods-text-secondary\" />}\n >\n {addButtonLabel}\n </Button>\n {addSecretButtonLabel && (\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"small\"\n onClick={() => handleAdd(true)}\n disabled={disabled}\n className=\"self-start\"\n leftIcon={<LockIcon className=\"text-ods-text-secondary\" />}\n >\n {addSecretButtonLabel}\n </Button>\n )}\n </div>\n </div>\n );\n};\n\nScriptArguments.displayName = 'ScriptArguments';\n","'use client';\n\nimport React from 'react';\nimport { cn } from '../../../utils/cn';\nimport { Button } from '../../ui/button';\nimport { InteractiveCard } from '../../ui/interactive-card';\nimport { StatusBadge } from '../../ui/status-badge';\n\nexport interface OnboardingStepCardProps {\n step: {\n id: string;\n title: string;\n description: string;\n actionIcon: (color?: string) => React.ReactNode;\n actionText: string;\n completedText: string;\n onAction: () => void | Promise<void>;\n onSkip?: () => void;\n };\n isCompleted: boolean;\n isSkipped: boolean;\n isCheckingCompletion: boolean;\n onAction: () => void | Promise<void>;\n onSkip: () => void;\n className?: string;\n}\n\nexport function OnboardingStepCard({\n step,\n isCompleted,\n isSkipped,\n isCheckingCompletion,\n onAction,\n onSkip,\n className,\n}: OnboardingStepCardProps) {\n const [isProcessing, setIsProcessing] = React.useState(false);\n\n const handleAction = async (e: React.MouseEvent) => {\n e.stopPropagation();\n setIsProcessing(true);\n try {\n await onAction();\n } finally {\n setIsProcessing(false);\n }\n };\n\n const handleSkip = (e: React.MouseEvent) => {\n e.stopPropagation();\n onSkip();\n };\n\n return (\n <InteractiveCard\n clickable={false}\n className={cn(\n 'rounded-[6px] border border-ods-border bg-ods-card',\n 'flex flex-col md:flex-row',\n 'min-h-[80px] md:h-[80px]',\n 'items-start md:items-center',\n 'gap-3 md:gap-4',\n 'px-4 py-4 md:py-0',\n className,\n )}\n >\n {/* Left column - content */}\n <div className=\"flex w-full min-w-0 flex-1 flex-col justify-center gap-1 md:w-auto\">\n <h3 className=\"truncate text-ods-text-primary text-h4\" title={step.title}>\n {step.title}\n </h3>\n <p className=\"h-[20px] truncate text-ods-text-secondary text-h6\" title={step.description}>\n {step.description}\n </p>\n </div>\n\n {/* Right column - action buttons, completed badge, or skipped badge */}\n <div\n className=\"flex w-full shrink-0 items-center justify-start gap-2 md:w-auto md:justify-end\"\n onClick={e => e.stopPropagation()}\n >\n {isCheckingCompletion ? (\n <>\n <div className=\"h-[32px] w-[100px] animate-pulse rounded-[6px] bg-ods-border\" />\n <div className=\"h-[32px] w-[120px] animate-pulse rounded-[6px] bg-ods-border\" />\n </>\n ) : isCompleted ? (\n <>\n <StatusBadge text=\"COMPLETED\" variant=\"card\" colorScheme=\"success\" />\n <Button\n variant=\"outline\"\n onClick={handleAction}\n disabled={isProcessing}\n leftIcon={step.actionIcon('white')}\n >\n {step.completedText}\n </Button>\n </>\n ) : isSkipped ? (\n <>\n <StatusBadge text=\"SKIPPED\" variant=\"card\" colorScheme=\"default\" />\n </>\n ) : (\n <>\n <Button variant=\"outline\" onClick={handleSkip}>\n Skip Step\n </Button>\n <Button variant=\"accent\" onClick={handleAction} disabled={isProcessing} leftIcon={step.actionIcon('black')}>\n {step.actionText}\n </Button>\n </>\n )}\n </div>\n </InteractiveCard>\n );\n}\n","'use client';\n\nimport React, { useRef, useCallback } from 'react';\nimport { useOnboardingState, type OnboardingStepConfig } from '../../../hooks/ui/use-onboarding-state';\nimport { cn } from '../../../utils/cn';\nimport { SECTION_HEADING_CLASS } from '../../layout/page-heading';\nimport { Button } from '../../ui/button';\nimport { OnboardingStepCard } from './onboarding-step-card';\n\nexport interface OnboardingWalkthroughProps {\n steps: OnboardingStepConfig[];\n /** Heading above the steps. Defaults to \"Get Started\". */\n title?: string;\n /**\n * What to render once the walkthrough is dismissed. Receives `restart`,\n * which clears every completed/skipped step and shows the walkthrough\n * again. Omitted: a dismissed walkthrough renders nothing.\n */\n renderDismissed?: (restart: () => void) => React.ReactNode;\n onDismiss?: () => void;\n storageKey?: string;\n className?: string;\n spacing?: string;\n /**\n * Completion status from hook-based checks (e.g., useOnboardingCompletion)\n * Object mapping step IDs to boolean completion status\n */\n completionStatus?: Record<string, boolean>;\n /**\n * Whether completion checks are still loading\n */\n isLoadingCompletion?: boolean;\n}\n\nexport function OnboardingWalkthrough({\n steps,\n title = 'Get Started',\n renderDismissed,\n onDismiss,\n storageKey = 'openframe-onboarding-state',\n className,\n spacing = 'space-y-4',\n completionStatus,\n isLoadingCompletion = false,\n}: OnboardingWalkthroughProps) {\n const {\n state,\n markComplete,\n markSkipped,\n dismissOnboarding,\n resetOnboarding,\n isStepComplete,\n isStepSkipped,\n allStepsComplete,\n markMultipleComplete,\n } = useOnboardingState(storageKey);\n\n // Refs to prevent race conditions - ALL refs must be declared before any conditional returns\n const hasAutoMarkedRef = useRef(false);\n const autoMarkingInProgressRef = useRef(false);\n const lastCompletionStatusRef = useRef<string | null>(null);\n // Ref to track in-flight action handlers - moved here to be before conditional return\n const actionInProgressRef = useRef<Set<string>>(new Set());\n\n // Sync completion status from hooks to localStorage\n // Uses refs to prevent duplicate calls and race conditions\n React.useEffect(() => {\n // Skip if still loading\n if (isLoadingCompletion) {\n hasAutoMarkedRef.current = false; // Reset when loading starts\n return;\n }\n\n // Skip if no completion status\n if (!completionStatus) return;\n\n // Create a stable key from completion status to detect actual changes.\n // An empty state (first load, or after a restart) is keyed by when it was\n // written, so a restart applies the same status again.\n const isFreshState = state.completedSteps.length === 0 && state.skippedSteps.length === 0;\n const statusKey = `${JSON.stringify(completionStatus)}|${isFreshState ? state.lastUpdated : ''}`;\n\n // Skip if we've already processed this exact status\n if (lastCompletionStatusRef.current === statusKey) return;\n\n // Skip if auto-marking is currently in progress\n if (autoMarkingInProgressRef.current) return;\n\n // Find steps that need to be marked complete\n // Read directly from state to avoid stale closure issues\n const completedStepIds = Object.entries(completionStatus)\n .filter(([stepId, isComplete]) => {\n if (!isComplete) return false;\n // Check against current state, not the callback\n return !state.completedSteps.includes(stepId);\n })\n .map(([stepId]) => stepId);\n\n if (completedStepIds.length > 0) {\n // Mark as in progress to prevent concurrent calls\n autoMarkingInProgressRef.current = true;\n\n markMultipleComplete(completedStepIds);\n\n // Update the last processed status key\n lastCompletionStatusRef.current = statusKey;\n\n // Reset the in-progress flag after a short delay\n // This prevents rapid successive calls while allowing future updates\n setTimeout(() => {\n autoMarkingInProgressRef.current = false;\n }, 100);\n } else {\n // Even if no steps to mark, update the status key to prevent re-processing\n lastCompletionStatusRef.current = statusKey;\n }\n }, [\n completionStatus,\n isLoadingCompletion,\n state.completedSteps,\n state.skippedSteps,\n state.lastUpdated,\n markMultipleComplete,\n ]);\n\n // useCallback must be called unconditionally (before any early returns)\n const handleStepAction = useCallback(\n async (step: OnboardingStepConfig) => {\n // Prevent duplicate action handling for the same step\n if (actionInProgressRef.current.has(step.id)) {\n return;\n }\n\n // Mark as in progress\n actionInProgressRef.current.add(step.id);\n\n try {\n await step.onAction();\n\n // Skip if already completed (could have been auto-marked while action was running)\n if (state.completedSteps.includes(step.id)) {\n return;\n }\n\n // Auto-mark Knowledge Base as complete (no verification needed)\n if (step.id === 'knowledge-base') {\n markComplete(step.id);\n return;\n }\n\n // For other steps, re-check completion after action\n if (step.checkComplete) {\n try {\n const isComplete = await step.checkComplete();\n\n // Double-check it wasn't completed while we were checking\n if (isComplete && !state.completedSteps.includes(step.id)) {\n markComplete(step.id);\n }\n } catch (error) {\n console.error(`Error checking completion for \"${step.id}\":`, error);\n }\n }\n } finally {\n // Remove from in-progress set\n actionInProgressRef.current.delete(step.id);\n }\n },\n [state.completedSteps, markComplete],\n );\n\n const handleStepSkip = (step: OnboardingStepConfig) => {\n step.onSkip?.();\n markSkipped(step.id);\n };\n\n const handleDismiss = () => {\n dismissOnboarding();\n onDismiss?.();\n };\n\n // ALL hooks have been called above - now safe to do conditional returns\n // Don't render if dismissed\n if (state.dismissed) {\n return renderDismissed ? <>{renderDismissed(resetOnboarding)}</> : null;\n }\n\n const isAllComplete = allStepsComplete(steps);\n\n return (\n <div className={cn('w-full space-y-4', className)}>\n {/* Header - responsive: stacks on mobile */}\n <div className=\"flex flex-col items-start justify-between gap-3 md:flex-row md:items-center md:gap-0\">\n <h2 className={SECTION_HEADING_CLASS}>{title}</h2>\n\n {isLoadingCompletion ? (\n <div className=\"h-[48px] w-full animate-pulse rounded-[6px] bg-ods-border md:w-[160px]\" />\n ) : isAllComplete ? (\n <Button variant=\"accent\" onClick={handleDismiss} className=\"w-full md:w-auto\">\n Close Onboarding\n </Button>\n ) : (\n <Button variant=\"outline\" onClick={handleDismiss} className=\"w-full md:w-auto\">\n Skip Onboarding\n </Button>\n )}\n </div>\n\n {/* Step cards - no wrapper, direct rendering */}\n <div className={cn(spacing)}>\n {steps.map(step => (\n <OnboardingStepCard\n key={step.id}\n step={step}\n isCompleted={isStepComplete(step.id)}\n isSkipped={isStepSkipped(step.id)}\n isCheckingCompletion={isLoadingCompletion}\n onAction={() => handleStepAction(step)}\n onSkip={() => handleStepSkip(step)}\n />\n ))}\n </div>\n </div>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-XWP5E453.cjs","../src/components/platform/SoftwareInfo.tsx","../src/components/platform/SoftwareSourceBadge.tsx","../src/components/platform/CveLink.tsx","../src/components/platform/ToolBadge.tsx","../src/components/platform/ShellTypeBadge.tsx","../src/components/platform/ScriptInfoSection.tsx","../src/components/platform/ScriptArguments.tsx","../src/components/shared/onboarding/onboarding-step-card.tsx","../src/components/shared/onboarding/onboarding-walkthrough.tsx"],"names":["jsx","jsxs","cn","Fragment"],"mappings":"AAAA,6xBAAY;AACZ;AACE;AACA;AACA;AACA;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACxBM,+CAAA;AAHC,IAAM,aAAA,EAA4C,CAAC,EAAE,IAAA,EAAM,MAAA,EAAQ,OAAA,EAAS,UAAU,CAAA,EAAA,GAAM;AACjG,EAAA,uBACE,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,kCAAA,qBAAG,EAAuB,SAAS,CAAA,EACjD,QAAA,EAAA;AAAA,oBAAA,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAU,yBAAA,EACb,QAAA,EAAA;AAAA,sBAAA,6BAAA,KAAC,EAAA,EAAI,SAAA,EAAU,+BAAA,EAAiC,QAAA,EAAA,KAAA,CAAK,CAAA;AAAA,MACpD,QAAA,mBACC,6BAAA,KAAC,EAAA,EAAI,SAAA,EAAU,qEAAA,EAAuE,QAAA,EAAA,QAAA,CAAQ;AAAA,IAAA,EAAA,CAElG,CAAA;AAAA,IACC,OAAA,mBAAU,6BAAA,KAAC,EAAA,EAAI,SAAA,EAAU,iCAAA,EAAmC,QAAA,EAAA,OAAA,CAAO;AAAA,EAAA,EAAA,CACtE,CAAA;AAEJ,CAAA;AAEA,YAAA,CAAa,YAAA,EAAc,cAAA;ADyB3B;AACA;AEE8B;AAD9B,IAAM,aAAA,EAAiF;AAAA,EACrF,IAAA,EAAM,EAAE,KAAA,EAAO,KAAA,EAAO,IAAA,kBAAMA,6BAAAA,2BAAC,EAAA,EAAU,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EAC9D,iBAAA,EAAmB,EAAE,KAAA,EAAO,QAAA,EAAU,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EAChF,cAAA,EAAgB,EAAE,KAAA,EAAO,SAAA,EAAW,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EAC9E,iBAAA,EAAmB,EAAE,KAAA,EAAO,QAAA,EAAU,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EAChF,aAAA,EAAe,EAAE,KAAA,EAAO,IAAA,EAAM,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACxE,iBAAA,EAAmB,EAAE,KAAA,EAAO,SAAA,EAAW,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACjF,aAAA,EAAe,EAAE,KAAA,EAAO,MAAA,EAAQ,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EAC1E,iBAAA,EAAmB,EAAE,KAAA,EAAO,UAAA,EAAY,IAAA,kBAAMA,6BAAAA,2BAAC,EAAA,EAAU,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EAChF,YAAA,EAAc,EAAE,KAAA,EAAO,KAAA,EAAO,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACxE,eAAA,EAAiB,EAAE,KAAA,EAAO,QAAA,EAAU,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EAC9E,WAAA,EAAa,EAAE,KAAA,EAAO,KAAA,EAAO,IAAA,kBAAMA,6BAAAA,2BAAC,EAAA,EAAU,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACrE,YAAA,EAAc,EAAE,KAAA,EAAO,KAAA,EAAO,IAAA,kBAAMA,6BAAAA,2BAAC,EAAA,EAAU,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACtE,YAAA,EAAc,EAAE,KAAA,EAAO,KAAA,EAAO,IAAA,kBAAMA,6BAAAA,2BAAC,EAAA,EAAU,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACtE,WAAA,EAAa,EAAE,KAAA,EAAO,KAAA,EAAO,IAAA,kBAAMA,6BAAAA,2BAAC,EAAA,EAAU,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACrE,gBAAA,EAAkB,EAAE,KAAA,EAAO,SAAA,EAAW,IAAA,kBAAMA,6BAAAA,2BAAC,EAAA,EAAU,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EAC9E,mBAAA,EAAqB,EAAE,KAAA,EAAO,YAAA,EAAc,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACtF,QAAA,EAAU,EAAE,KAAA,EAAO,SAAA,EAAW,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAAA,EACxE,YAAA,EAAc,EAAE,KAAA,EAAO,KAAA,EAAO,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG;AAC1E,CAAA;AAEO,IAAM,oBAAA,EAA0D,CAAC,EAAE,MAAA,EAAQ,UAAU,CAAA,EAAA,GAAM;AAChG,EAAA,MAAM,OAAA,EAAS,YAAA,CAAa,MAAM,EAAA,GAAK,EAAE,KAAA,EAAO,MAAA,EAAQ,IAAA,kBAAMA,6BAAAA,6BAAC,EAAA,EAAY,SAAA,EAAU,UAAA,CAAU,EAAG,CAAA;AAElG,EAAA,uBACEC,8BAAAA,MAAC,EAAA,EAAK,SAAA,EAAWC,kCAAAA,sDAAG,EAAwD,SAAS,CAAA,EAClF,QAAA,EAAA;AAAA,IAAA,MAAA,CAAO,IAAA;AAAA,IACP,MAAA,CAAO;AAAA,EAAA,EAAA,CACV,CAAA;AAEJ,CAAA;AAEA,mBAAA,CAAoB,YAAA,EAAc,qBAAA;AFHlC;AACA;AGvEI;AAJG,IAAM,QAAA,EAAkC,CAAC,EAAE,KAAA,EAAO,UAAU,CAAA,EAAA,GAAM;AACvE,EAAA,MAAM,QAAA,EAAU,CAAA,iCAAA,EAAoC,KAAK,CAAA,CAAA;AAGvDD,EAAAA;AAAC,IAAA;AAAA,IAAA;AACO,MAAA;AACC,MAAA;AACH,MAAA;AACO,MAAA;AACT,QAAA;AACA,QAAA;AACF,MAAA;AAEA,MAAA;AAAa,wBAAA;AACW,wBAAA;AAA0F,MAAA;AAAA,IAAA;AACpH,EAAA;AAEJ;AAEsB;AH8EsC;AACA;AIvFxD;AAJ2F;AAC1D,EAAA;AAGd,EAAA;AACwB,oBAAA;AACzB,oBAAA;AAClB,EAAA;AAEJ;AAEwB;AJ0FoC;AACA;AKxDxD;AAjDqD;AACzB,EAAA;AACtB,IAAA;AACkD,IAAA;AAC1D,EAAA;AACuB,EAAA;AACf,IAAA;AACkD,IAAA;AAC1D,EAAA;AACwB,EAAA;AAChB,IAAA;AACkD,IAAA;AAC1D,EAAA;AAC0B,EAAA;AAClB,IAAA;AACkD,IAAA;AAC1D,EAAA;AAC2B,EAAA;AACnB,IAAA;AACkD,IAAA;AAC1D,EAAA;AACwB,EAAA;AAChB,IAAA;AACkD,IAAA;AAC1D,EAAA;AACyB,EAAA;AACjB,IAAA;AACkD,IAAA;AAC1D,EAAA;AACF;AAE2C;AACnC,EAAA;AACkD,EAAA;AAC1D;AAQoG;AACpD,EAAA;AACJ,EAAA;AACQ,EAAA;AACM,EAAA;AAGnC,EAAA;AACQ,oBAAA;AACT,oBAAA;AAClB,EAAA;AAEJ;AAE6B;ALgG+B;AACA;AMxGhD;AAxBoD;AACpB,EAAA;AACjC,IAAA;AACT,EAAA;AACuD,EAAA;AACzD;AAYsE;AAE/C,EAAA;AAGA,IAAA;AAYF,oBAAA;AACG,sBAAA;AAGA,sBAAA;AAClB,IAAA;AACF,EAAA;AAEJ;AAiBoE;AAClE,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACI;AACsC,EAAA;AACM,EAAA;AAG3B,EAAA;AAEF,oBAAA;AAEG,sBAAA;AACe,MAAA;AAEjC,IAAA;AAOe,oBAAA;AACgB,sBAAA;AACb,sBAAA;AAEW,sBAAA;AACA,MAAA;AAC7B,IAAA;AAEe,oBAAA;AACc,sBAAA;AACA,MAAA;AAC7B,IAAA;AACF,EAAA;AAEJ;AAEgC;ANwE4B;AACA;AO3NrC;AAyIX;AA1HQ;AAEW;AAmEiC;AACnD,EAAA;AACX,EAAA;AACiB,EAAA;AACE,EAAA;AACF,EAAA;AACjB,EAAA;AACW,EAAA;AACX,EAAA;AACA,EAAA;AACI;AACoD,EAAA;AAC9B,IAAA;AAC8B,IAAA;AAC7B,IAAA;AAC3B,EAAA;AAE4D,EAAA;AAClC,IAAA;AAC8B,IAAA;AAC7B,IAAA;AAC3B,EAAA;AAEqC,EAAA;AACX,IAAA;AACwB,IAAA;AACvB,IAAA;AAC3B,EAAA;AAEsC,EAAA;AACZ,IAAA;AACO,IAAA;AACP,MAAA;AACjB,MAAA;AACE,MAAA;AAAA;AAEsB,MAAA;AAC/B,IAAA;AACmC,IAAA;AACrC,EAAA;AAEgD,EAAA;AAG3B,EAAA;AACS,IAAA;AACyB,MAAA;AAER,MAAA;AAGX,MAAA;AAEX,wBAAA;AACU,UAAA;AACvBD,0BAAAA;AAAC,YAAA;AAAA,YAAA;AACY,cAAA;AAC8B,cAAA;AAC5B,cAAA;AACb,cAAA;AACU,cAAA;AACc,cAAA;AACKA,cAAAA;AAA8C,YAAA;AAC7E,UAAA;AACF,QAAA;AAGe,wBAAA;AACE,0BAAA;AACZ,YAAA;AAAA,YAAA;AAEiC,cAAA;AACY,cAAA;AACjC,cAAA;AACgC,cAAA;AACJ,cAAA;AACvC,cAAA;AACW,cAAA;AACK,gBAAA;AAAA;AAED,gBAAA;AACf,cAAA;AAAA,YAAA;AAEJ,UAAA;AACAA,0BAAAA;AAAC,YAAA;AAAA,YAAA;AACM,cAAA;AACG,cAAA;AACH,cAAA;AAC6B,cAAA;AAClC,cAAA;AACW,cAAA;AACO,cAAA;AAAwD,YAAA;AAC5E,UAAA;AACF,QAAA;AACF,MAAA;AAEH,IAAA;AAGc,oBAAA;AACbA,sBAAAA;AAAC,QAAA;AAAA,QAAA;AACM,UAAA;AACG,UAAA;AACH,UAAA;AACoB,UAAA;AACzB,UAAA;AACU,UAAA;AACgB,UAAA;AAEzB,UAAA;AAAA,QAAA;AACH,MAAA;AAEEA,MAAAA;AAAC,QAAA;AAAA,QAAA;AACM,UAAA;AACG,UAAA;AACH,UAAA;AACwB,UAAA;AAC7B,UAAA;AACU,UAAA;AACU,UAAA;AAEnB,UAAA;AAAA,QAAA;AACH,MAAA;AAEJ,IAAA;AACF,EAAA;AAEJ;AAE8B;APoI8B;AACA;AQhW1C;AAiEZ;AAxC6B;AACjC,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AAC0B;AAC6B,EAAA;AAEH,EAAA;AAChC,IAAA;AACE,IAAA;AAChB,IAAA;AACa,MAAA;AACf,IAAA;AACqB,MAAA;AACvB,IAAA;AACF,EAAA;AAE4C,EAAA;AACxB,IAAA;AACX,IAAA;AACT,EAAA;AAGEC,EAAAA;AAAC,IAAA;AAAA,IAAA;AACY,MAAA;AACA,MAAA;AACT,QAAA;AACA,QAAA;AACA,QAAA;AACA,QAAA;AACA,QAAA;AACA,QAAA;AACA,QAAA;AACF,MAAA;AAGA,MAAA;AAAe,wBAAA;AACC,0BAAA;AAGD,0BAAA;AAGf,QAAA;AAGAD,wBAAAA;AAAC,UAAA;AAAA,UAAA;AACW,YAAA;AACsB,YAAA;AAG9B,YAAA;AACiB,8BAAA;AACA,8BAAA;AAGjB,YAAA;AACoB,8BAAA;AAClBA,8BAAAA;AAAC,gBAAA;AAAA,gBAAA;AACS,kBAAA;AACC,kBAAA;AACC,kBAAA;AACuB,kBAAA;AAE3B,kBAAA;AAAA,gBAAA;AACR,cAAA;AAGF,YAAA;AAKkB,8BAAA;AAGA,8BAAA;AAGlB,YAAA;AAAA,UAAA;AAEJ,QAAA;AAAA,MAAA;AAAA,IAAA;AACF,EAAA;AAEJ;ARyT4D;AACA;AS3ajB;AA8LrCC;AA9JgC;AACpC,EAAA;AACQ,EAAA;AACR,EAAA;AACA,EAAA;AACa,EAAA;AACb,EAAA;AACU,EAAA;AACV,EAAA;AACsB,EAAA;AACO;AACvB,EAAA;AACJ,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AAC+B,EAAA;AAGI,EAAA;AACQ,EAAA;AACa,EAAA;AAEN,EAAA;AAI9B,EAAA;AAEK,IAAA;AACI,MAAA;AAC3B,MAAA;AACF,IAAA;AAGuB,IAAA;AAK8B,IAAA;AACA,IAAA;AAGF,IAAA;AAGb,IAAA;AAIkB,IAAA;AAE5B,MAAA;AAEoB,MAAA;AAErB,IAAA;AAEM,IAAA;AAEI,MAAA;AAEE,MAAA;AAGH,MAAA;AAIjB,MAAA;AACoB,QAAA;AAC/B,MAAA;AACD,IAAA;AAE6B,MAAA;AACpC,IAAA;AACC,EAAA;AACD,IAAA;AACA,IAAA;AACM,IAAA;AACA,IAAA;AACA,IAAA;AACN,IAAA;AACD,EAAA;AAGwB,EAAA;AACe,IAAA;AAEU,MAAA;AAC5C,QAAA;AACF,MAAA;AAGuC,MAAA;AAEnC,MAAA;AACkB,QAAA;AAGwB,QAAA;AAC1C,UAAA;AACF,QAAA;AAGkC,QAAA;AACZ,UAAA;AACpB,UAAA;AACF,QAAA;AAGwB,QAAA;AAClB,UAAA;AAC0C,YAAA;AAGJ,YAAA;AAClB,cAAA;AACtB,YAAA;AACc,UAAA;AACkC,YAAA;AAClD,UAAA;AACF,QAAA;AACA,MAAA;AAE0C,QAAA;AAC5C,MAAA;AACF,IAAA;AACmC,IAAA;AACrC,EAAA;AAEuD,EAAA;AACvC,oBAAA;AACK,IAAA;AACrB,EAAA;AAE4B,EAAA;AACR,IAAA;AACN,oBAAA;AACd,EAAA;AAIqB,EAAA;AACME,IAAAA;AAC3B,EAAA;AAE4C,EAAA;AAGvB,EAAA;AAEF,oBAAA;AACE,sBAAA;AAGR,MAAA;AAUT,IAAA;AAIG,oBAAA;AACE,MAAA;AAAA,MAAA;AAEC,QAAA;AACmC,QAAA;AACH,QAAA;AACV,QAAA;AACe,QAAA;AACJ,QAAA;AAAA,MAAA;AANvB,MAAA;AAShB,IAAA;AACF,EAAA;AAEJ;ATwU4D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-XWP5E453.cjs","sourcesContent":[null,"/**\n * SoftwareInfo Component\n *\n * Displays software name with optional vendor information below it.\n * Part of the ODS (OpenFrame Design System) platform components.\n *\n * @example\n * ```tsx\n * <SoftwareInfo name=\"Visual Studio Code\" vendor=\"Microsoft\" />\n * <SoftwareInfo name=\"Chrome\" /> // Without vendor\n * ```\n */\n\nimport type React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface SoftwareInfoProps {\n /** Software name (required) */\n name: string;\n /** Software vendor (optional) */\n vendor?: string;\n /** Software version (optional) */\n version?: string;\n /** Additional CSS classes */\n className?: string;\n}\n\nexport const SoftwareInfo: React.FC<SoftwareInfoProps> = ({ name, vendor, version, className }) => {\n return (\n <div className={cn('flex flex-col gap-1', className)}>\n <div className=\"flex items-center gap-2\">\n <div className=\"text-ods-text-primary text-h4\">{name}</div>\n {version && (\n <div className=\"rounded bg-ods-bg-surface px-2 py-1 text-ods-text-secondary text-h6\">{version}</div>\n )}\n </div>\n {vendor && <div className=\"text-ods-text-secondary text-h6\">{vendor}</div>}\n </div>\n );\n};\n\nSoftwareInfo.displayName = 'SoftwareInfo';\n","/**\n * SoftwareSourceBadge Component\n *\n * Displays a badge for software source types from Fleet MDM.\n * Supports all osquery software source types with appropriate styling.\n *\n * Fleet MDM Software Sources:\n * - apps: macOS Applications\n * - chrome_extensions: Chrome Browser Extensions\n * - firefox_addons: Firefox Browser Extensions\n * - safari_extensions: Safari Browser Extensions\n * - ie_extensions: Internet Explorer Extensions\n * - vscode_extensions: VS Code Extensions\n * - atom_packages: Atom Packages\n * - homebrew_packages: Homebrew Packages (macOS)\n * - npm_packages: NPM Packages\n * - python_packages: Python Packages\n * - apt_sources: APT Packages (Debian/Ubuntu)\n * - deb_packages: DEB Packages\n * - rpm_packages: RPM Packages (Red Hat/CentOS)\n * - yum_sources: YUM Packages\n * - portage_packages: Portage Packages (Gentoo)\n * - chocolatey_packages: Chocolatey Packages (Windows)\n * - programs: Windows Programs\n * - pkg_packages: PKG Packages\n *\n * @example\n * ```tsx\n * <SoftwareSourceBadge source=\"apps\" />\n * <SoftwareSourceBadge source=\"chrome_extensions\" />\n * <SoftwareSourceBadge source=\"python_packages\" />\n * ```\n */\n\nimport type React from 'react';\nimport { cn } from '../../utils/common';\nimport { PackageIcon, WindowsIcon, MacOSIcon, LinuxIcon } from '../icons';\n\nexport type SoftwareSource =\n | 'apps'\n | 'chrome_extensions'\n | 'firefox_addons'\n | 'safari_extensions'\n | 'ie_extensions'\n | 'vscode_extensions'\n | 'atom_packages'\n | 'homebrew_packages'\n | 'npm_packages'\n | 'python_packages'\n | 'apt_sources'\n | 'deb_packages'\n | 'rpm_packages'\n | 'yum_sources'\n | 'portage_packages'\n | 'chocolatey_packages'\n | 'programs'\n | 'pkg_packages';\n\nexport interface SoftwareSourceBadgeProps {\n /** Software source type from Fleet MDM */\n source: SoftwareSource;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Maps source types to human-readable labels and icons\n */\nconst sourceConfig: Record<SoftwareSource, { label: string; icon: React.ReactNode }> = {\n apps: { label: 'App', icon: <MacOSIcon className=\"h-4 w-4\" /> },\n chrome_extensions: { label: 'Chrome', icon: <PackageIcon className=\"h-4 w-4\" /> },\n firefox_addons: { label: 'Firefox', icon: <PackageIcon className=\"h-4 w-4\" /> },\n safari_extensions: { label: 'Safari', icon: <PackageIcon className=\"h-4 w-4\" /> },\n ie_extensions: { label: 'IE', icon: <PackageIcon className=\"h-4 w-4\" /> },\n vscode_extensions: { label: 'VS Code', icon: <PackageIcon className=\"h-4 w-4\" /> },\n atom_packages: { label: 'Atom', icon: <PackageIcon className=\"h-4 w-4\" /> },\n homebrew_packages: { label: 'Homebrew', icon: <MacOSIcon className=\"h-4 w-4\" /> },\n npm_packages: { label: 'NPM', icon: <PackageIcon className=\"h-4 w-4\" /> },\n python_packages: { label: 'Python', icon: <PackageIcon className=\"h-4 w-4\" /> },\n apt_sources: { label: 'APT', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n deb_packages: { label: 'DEB', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n rpm_packages: { label: 'RPM', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n yum_sources: { label: 'YUM', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n portage_packages: { label: 'Portage', icon: <LinuxIcon className=\"h-4 w-4\" /> },\n chocolatey_packages: { label: 'Chocolatey', icon: <WindowsIcon className=\"h-4 w-4\" /> },\n programs: { label: 'Windows', icon: <WindowsIcon className=\"h-4 w-4\" /> },\n pkg_packages: { label: 'PKG', icon: <PackageIcon className=\"h-4 w-4\" /> },\n};\n\nexport const SoftwareSourceBadge: React.FC<SoftwareSourceBadgeProps> = ({ source, className }) => {\n const config = sourceConfig[source] || { label: source, icon: <PackageIcon className=\"h-4 w-4\" /> };\n\n return (\n <span className={cn('inline-flex items-center gap-2 text-ods-text-primary', className)}>\n {config.icon}\n {config.label}\n </span>\n );\n};\n\nSoftwareSourceBadge.displayName = 'SoftwareSourceBadge';\n","/**\n * CveLink Component\n *\n * Displays a CVE ID with an external link icon that links to the NIST NVD database.\n * Part of the ODS (OpenFrame Design System) platform components.\n *\n * @example\n * ```tsx\n * <CveLink cveId=\"CVE-2024-1234\" />\n * ```\n */\n\nimport type React from 'react';\nimport { cn } from '../../utils/cn';\nimport { CustomExternalLinkIcon } from '../icons';\n\nexport interface CveLinkProps {\n /** CVE ID (e.g., \"CVE-2024-1234\") */\n cveId: string;\n /** Additional CSS classes */\n className?: string;\n}\n\nexport const CveLink: React.FC<CveLinkProps> = ({ cveId, className }) => {\n const nistUrl = `https://nvd.nist.gov/vuln/detail/${cveId}`;\n\n return (\n <a\n href={nistUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={cn(\n 'group inline-flex items-center gap-2 text-ods-text-primary transition-colors text-code hover:text-ods-accent',\n className,\n )}\n >\n <span>{cveId}</span>\n <CustomExternalLinkIcon className=\"h-4 w-4 text-ods-text-secondary transition-colors group-hover:text-ods-accent\" />\n </a>\n );\n};\n\nCveLink.displayName = 'CveLink';\n","/**\n * ToolBadge Component\n *\n * Displays a tool type badge with icon for OpenFrame integrated tools.\n * Used in tables to show tool sources like Fleet MDM, MeshCentral, etc.\n *\n * @example\n * ```tsx\n * <ToolBadge toolType=\"OPENFRAME_RMM\" />\n * <ToolBadge toolType=\"FLEET\" />\n * <ToolBadge toolType=\"MESHCENTRAL\" />\n * ```\n */\n\nimport type React from 'react';\nimport type { ToolType } from '../../types/tool.types';\nimport { cn } from '../../utils/cn';\nimport { getToolLabel } from '../../utils/tool-utils';\nimport { ToolIcon } from '../tool-icon';\n\nexport type { ToolType } from '../../types/tool.types';\n\nexport interface ToolBadgeProps {\n /** Tool type */\n toolType: ToolType;\n /** Additional CSS classes */\n className?: string;\n iconClassName?: string;\n}\n\nexport const ToolBadge: React.FC<ToolBadgeProps> = ({ toolType, className, iconClassName }) => {\n const label = getToolLabel(toolType);\n\n return (\n <div className={cn('flex items-center gap-1 text-ods-text-secondary', className)}>\n <ToolIcon toolType={toolType} className={iconClassName} size={16} />\n <span className=\"text-ods-text-primary text-h4\">{label}</span>\n </div>\n );\n};\n\nToolBadge.displayName = 'ToolBadge';\n","/**\n * ShellTypeBadge Component\n *\n * Displays a badge for shell/script types with appropriate icon and label.\n * Supports all RMM shell types.\n */\n\nimport type React from 'react';\nimport { type ShellType, ShellTypeValues } from '../../types/shell.types';\nimport { cn } from '../../utils/cn';\nimport { getShellLabel } from '../../utils/shell-utils';\nimport { BashIcon, CmdIcon, DenoIcon, NushellIcon, ShellIcon } from '../icons';\nimport { PowershellLogoGreyIcon } from '../icons-v2-generated/brand-logos/powershell-logo-grey-icon';\nimport { PythonLogoIcon } from '../icons-v2-generated/brand-logos/python-logo-icon';\n\n/**\n * Shell icon configuration with typed mapping\n */\ninterface ShellIconConfig {\n icon: React.ComponentType<{ size?: number; color?: string; className?: string }>;\n props: { size: number } & ({ className: string } | { color: string });\n}\n\n/**\n * Typed mapping of shell types to their icon configurations\n * Using Record<ShellType, ...> ensures all shell types are covered\n */\nconst shellIconMap: Record<ShellType, ShellIconConfig> = {\n [ShellTypeValues.POWERSHELL]: {\n icon: PowershellLogoGreyIcon,\n props: { size: 16, className: 'text-ods-text-secondary' },\n },\n [ShellTypeValues.CMD]: {\n icon: CmdIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n [ShellTypeValues.BASH]: {\n icon: BashIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n [ShellTypeValues.PYTHON]: {\n icon: PythonLogoIcon,\n props: { size: 16, className: 'text-ods-text-secondary' },\n },\n [ShellTypeValues.NUSHELL]: {\n icon: NushellIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n [ShellTypeValues.DENO]: {\n icon: DenoIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n [ShellTypeValues.SHELL]: {\n icon: ShellIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n },\n} as const;\n\nconst defaultIconConfig: ShellIconConfig = {\n icon: ShellIcon,\n props: { size: 16, color: 'var(--color-text-secondary)' },\n};\n\nexport interface ShellTypeBadgeProps {\n shellType: ShellType;\n className?: string;\n iconClassName?: string;\n}\n\nexport const ShellTypeBadge: React.FC<ShellTypeBadgeProps> = ({ shellType, className, iconClassName }) => {\n const normalizedType = shellType?.toUpperCase() as ShellType;\n const label = getShellLabel(normalizedType);\n const { icon: IconComponent, props: iconProps } = shellIconMap[normalizedType] ?? defaultIconConfig;\n const defaultIconClassName = 'className' in iconProps ? iconProps.className : undefined;\n\n return (\n <div className={cn('flex items-center gap-1', className)}>\n <IconComponent size={16} className={cn(defaultIconClassName, iconClassName)} />\n <span className=\"text-ods-text-primary text-h4\">{label}</span>\n </div>\n );\n};\n\nShellTypeBadge.displayName = 'ShellTypeBadge';\n","/**\n * ScriptInfoSection Component\n *\n * Displays script information in a card with header (title, description)\n * and detail cells (shell type, supported platforms, category, author).\n * Responsive layout: stacks cells on mobile, shows grid on desktop.\n */\n\nimport type React from 'react';\nimport Image from '../../embed-shims/next-image';\nimport { cn } from '../../utils/cn';\nimport { nameInitials } from '../../utils/format';\nimport { getOSLabel } from '../../utils/os-utils';\nimport { getShellLabel } from '../../utils/shell-utils';\n\n/**\n * Props for author avatar display\n */\nexport interface ScriptAuthor {\n /** Author name */\n name: string;\n /** Author initials (used when no photo) */\n initials?: string;\n /** URL to author's photo */\n photoUrl?: string;\n}\n\n/**\n * Props for ScriptInfoSection component\n */\nexport interface ScriptInfoSectionProps {\n /** Script title/name */\n headline: string;\n /** Script description */\n subheadline?: string;\n /** Shell type (POWERSHELL, BASH, CMD, etc.) */\n shellType?: string;\n /** Array of supported platform strings (windows, darwin, linux, etc.) */\n supportedPlatforms?: string[];\n /** Script category */\n category: string;\n /** Author information */\n author?: ScriptAuthor;\n /** Additional CSS classes */\n className?: string;\n}\n\n/**\n * Formats supported platforms array into a display string\n * @param platforms - Array of platform strings (e.g., ['windows', 'darwin', 'linux'])\n * @returns Formatted string (e.g., 'Windows, macOS, Linux')\n */\nfunction formatSupportedPlatforms(platforms?: string[]): string {\n if (!platforms || platforms.length === 0) {\n return 'All Platforms';\n }\n return platforms.map(platform => getOSLabel(platform)).join(', ');\n}\n\n/**\n * InfoCell - Single info cell with label and value\n */\ninterface InfoCellProps {\n label: string;\n value: string;\n avatar?: ScriptAuthor;\n className?: string;\n}\n\nfunction InfoCell({ label, value, avatar, className }: InfoCellProps) {\n return (\n <div className={cn('flex min-w-0 items-center gap-2', className)}>\n {/* Avatar for author cell */}\n {avatar && (\n <div className=\"relative size-8 shrink-0 overflow-hidden rounded-full border border-ods-border bg-ods-bg\">\n {avatar.photoUrl ? (\n <Image src={avatar.photoUrl} alt={avatar.name} className=\"object-cover\" fill sizes=\"32px\" unoptimized />\n ) : (\n <div className=\"flex size-full items-center justify-center text-ods-text-secondary text-h6\">\n {avatar.initials || nameInitials(avatar.name)}\n </div>\n )}\n </div>\n )}\n\n {/* Text content */}\n <div className=\"flex min-w-0 flex-col\">\n <span className=\"truncate text-ods-text-primary text-h4\" title={value}>\n {value}\n </span>\n <span className=\"truncate text-ods-text-secondary text-h6\">{label}</span>\n </div>\n </div>\n );\n}\n\n/**\n * ScriptInfoSection - Displays script information in a structured card\n *\n * @example\n * ```tsx\n * <ScriptInfoSection\n * title=\"System Backup Script\"\n * description=\"Comprehensive Linux system backup script...\"\n * shellType=\"BASH\"\n * supportedPlatforms={['linux']}\n * category=\"System Maintenance\"\n * author={{ name: 'John Doe', photoUrl: '/avatars/john.jpg' }}\n * />\n * ```\n */\nexport const ScriptInfoSection: React.FC<ScriptInfoSectionProps> = ({\n headline,\n subheadline,\n shellType,\n supportedPlatforms,\n category,\n author,\n className,\n}) => {\n const shellLabel = getShellLabel(shellType);\n const platformsLabel = formatSupportedPlatforms(supportedPlatforms);\n\n return (\n <div className={cn('overflow-hidden rounded-[6px] border border-ods-border bg-ods-card', className)}>\n {/* Header row with title and description */}\n <div className=\"border-b border-ods-border p-4\">\n <div className=\"flex flex-col gap-1\">\n <h3 className=\"text-ods-text-primary text-h4\">{headline}</h3>\n {subheadline && <p className=\"break-words text-ods-text-secondary text-h6\">{subheadline}</p>}\n </div>\n </div>\n\n {/* Details section with info cells\n - Mobile/Tablet (<lg): 2x2 grid with divider between rows\n - Desktop (lg+): 4 columns in single row\n */}\n {/* First row: Shell Type, Supported Platforms */}\n <div className=\"grid grid-cols-2 gap-4 border-b border-ods-border px-4 py-4 lg:grid-cols-4 lg:border-b-0\">\n <InfoCell label=\"Shell Type\" value={shellLabel} />\n <InfoCell label=\"Supported Platforms\" value={platformsLabel} />\n {/* Desktop only: Category and Author in same row */}\n <InfoCell label=\"Category\" value={category} className=\"hidden lg:flex\" />\n {author && <InfoCell label=\"Added by\" value={author.name} avatar={author} className=\"hidden lg:flex\" />}\n </div>\n {/* Second row (mobile/tablet only): Category, Author */}\n <div className=\"grid grid-cols-2 gap-4 px-4 py-4 lg:hidden\">\n <InfoCell label=\"Category\" value={category} />\n {author && <InfoCell label=\"Added by\" value={author.name} avatar={author} />}\n </div>\n </div>\n );\n};\n\nScriptInfoSection.displayName = 'ScriptInfoSection';\n","/**\n * ScriptArguments Component\n *\n * Displays and manages script arguments as key-value pairs.\n * Each argument has a name (key) and value input field with delete button.\n * Includes an \"Add Script Argument\" button to add new entries.\n */\n\nimport { Trash2 } from 'lucide-react';\nimport type React from 'react';\nimport { cn } from '../../utils/cn';\nimport { LockIcon, PlusCircleIcon } from '../icons-v2-generated';\nimport { Button } from '../ui/button';\nimport { Input } from '../ui/input';\nimport { Label } from '../ui/label';\n\n/**\n * What an untouched stored secret shows in its value field.\n *\n * Rendered as the field's PLACEHOLDER, never as its value: a mask held in\n * `value` is indistinguishable from something the user typed, and would be\n * submitted back as the secret itself.\n */\nconst SECRET_MASK = '**********';\n\nconst STORED_SECRET_KEY_HINT = \"A stored secret can't be renamed — delete it and add a new one\";\n\n/**\n * Single script argument with key and value\n */\nexport interface ScriptArgument {\n /** Unique identifier for the argument */\n id: string;\n /** Argument name/key */\n key: string;\n /** Argument value (empty string for flag-type arguments) */\n value: string;\n /**\n * A secret pair: the key carries a lock and the value is typed as a password.\n * Meaningful for environment variables only.\n */\n secret?: boolean;\n /**\n * The server holds a value for this secret and does not send it back. While\n * `value` is empty the field shows a mask, so empty means \"keep what is\n * stored\" and typing replaces it.\n *\n * The stored value is bound to the key, which is therefore read-only:\n * renaming would leave the old name holding the secret and the new one\n * holding nothing.\n */\n hasStoredValue?: boolean;\n}\n\n/**\n * Props for ScriptArguments component\n */\nexport interface ScriptArgumentsProps {\n /** Array of script arguments */\n arguments: ScriptArgument[];\n /** Callback when arguments change */\n onArgumentsChange?: (args: ScriptArgument[]) => void;\n /** Placeholder for key input */\n keyPlaceholder?: string;\n /** Placeholder for value input */\n valuePlaceholder?: string;\n /** Label for the add button */\n addButtonLabel?: string;\n /** Label for a second add button that appends a secret pair. Omit to not offer secrets. */\n addSecretButtonLabel?: string;\n /** Whether the component is disabled */\n disabled?: boolean;\n /** Additional CSS classes */\n className?: string;\n /** Label for the title input */\n titleLabel: string;\n}\n\n/**\n * ScriptArguments - Displays and manages script arguments\n *\n * @example\n * ```tsx\n * <ScriptArguments\n * arguments={[\n * { id: '1', key: 'port', value: '3000' },\n * { id: '2', key: 'verbose', value: '' },\n * ]}\n * onArgumentsChange={(args) => setArguments(args)}\n * />\n * ```\n */\nexport const ScriptArguments: React.FC<ScriptArgumentsProps> = ({\n arguments: args,\n onArgumentsChange,\n keyPlaceholder = 'Enter Key',\n valuePlaceholder = 'Enter Value (empty=flag)',\n addButtonLabel = 'Add Script Argument',\n addSecretButtonLabel,\n disabled = false,\n className,\n titleLabel,\n}) => {\n const handleKeyChange = (id: string, newKey: string) => {\n if (!onArgumentsChange) return;\n const updated = args.map(arg => (arg.id === id ? { ...arg, key: newKey } : arg));\n onArgumentsChange(updated);\n };\n\n const handleValueChange = (id: string, newValue: string) => {\n if (!onArgumentsChange) return;\n const updated = args.map(arg => (arg.id === id ? { ...arg, value: newValue } : arg));\n onArgumentsChange(updated);\n };\n\n const handleDelete = (id: string) => {\n if (!onArgumentsChange) return;\n const updated = args.filter(arg => arg.id !== id);\n onArgumentsChange(updated);\n };\n\n const handleAdd = (secret = false) => {\n if (!onArgumentsChange) return;\n const newArg: ScriptArgument = {\n id: crypto.randomUUID(),\n key: '',\n value: '',\n // Only set on a secret, so a plain pair keeps the shape it always had.\n ...(secret && { secret: true }),\n };\n onArgumentsChange([...args, newArg]);\n };\n\n const isFirstRow = (index: number) => index === 0;\n\n return (\n <div className={cn('flex flex-col gap-2', className)}>\n {args.map((arg, index) => {\n const isStoredSecret = Boolean(arg.secret && arg.hasStoredValue);\n // The mask stands for the stored value, so it goes once the user types a replacement.\n const showsMask = isStoredSecret && !arg.value;\n\n return (\n <div key={arg.id} className=\"flex w-full items-end gap-2\">\n {/* Key input - with label only on first row */}\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n {isFirstRow(index) && <Label spacing=\"tight\">{titleLabel}</Label>}\n <Input\n value={arg.key}\n onChange={e => handleKeyChange(arg.id, e.target.value)}\n placeholder={keyPlaceholder}\n disabled={disabled}\n readOnly={isStoredSecret}\n title={isStoredSecret ? STORED_SECRET_KEY_HINT : undefined}\n startAdornment={arg.secret ? <LockIcon role=\"img\" aria-label=\"Secret\" /> : undefined}\n />\n </div>\n\n {/* Value input with delete button */}\n <div className=\"flex min-w-0 flex-1 items-center gap-2\">\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <Input\n // `new-password` keeps a password manager from filling a saved login into a secret.\n type={arg.secret ? 'password' : undefined}\n autoComplete={arg.secret ? 'new-password' : undefined}\n value={arg.value}\n onChange={e => handleValueChange(arg.id, e.target.value)}\n placeholder={showsMask ? SECRET_MASK : valuePlaceholder}\n disabled={disabled}\n className={cn(\n !arg.value && 'placeholder:text-ods-text-muted',\n // The mask reads as a value that is there, not as a prompt to fill one in.\n showsMask && '[&_input]:placeholder:text-ods-text-primary',\n )}\n />\n </div>\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"icon\"\n onClick={() => handleDelete(arg.id)}\n disabled={disabled}\n aria-label=\"Delete argument\"\n leftIcon={<Trash2 className=\"size-4 md:size-6\" color=\"var(--color-error)\" />}\n />\n </div>\n </div>\n );\n })}\n\n {/* Add buttons - aligned left */}\n <div className=\"flex flex-wrap justify-start gap-[var(--spacing-system-xs)]\">\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"small\"\n onClick={() => handleAdd()}\n disabled={disabled}\n className=\"self-start\"\n leftIcon={<PlusCircleIcon className=\"text-ods-text-secondary\" />}\n >\n {addButtonLabel}\n </Button>\n {addSecretButtonLabel && (\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"small\"\n onClick={() => handleAdd(true)}\n disabled={disabled}\n className=\"self-start\"\n leftIcon={<LockIcon className=\"text-ods-text-secondary\" />}\n >\n {addSecretButtonLabel}\n </Button>\n )}\n </div>\n </div>\n );\n};\n\nScriptArguments.displayName = 'ScriptArguments';\n","'use client';\n\nimport React from 'react';\nimport { cn } from '../../../utils/cn';\nimport { Button } from '../../ui/button';\nimport { InteractiveCard } from '../../ui/interactive-card';\nimport { StatusBadge } from '../../ui/status-badge';\n\nexport interface OnboardingStepCardProps {\n step: {\n id: string;\n title: string;\n description: string;\n actionIcon: (color?: string) => React.ReactNode;\n actionText: string;\n completedText: string;\n onAction: () => void | Promise<void>;\n onSkip?: () => void;\n };\n isCompleted: boolean;\n isSkipped: boolean;\n isCheckingCompletion: boolean;\n onAction: () => void | Promise<void>;\n onSkip: () => void;\n className?: string;\n}\n\nexport function OnboardingStepCard({\n step,\n isCompleted,\n isSkipped,\n isCheckingCompletion,\n onAction,\n onSkip,\n className,\n}: OnboardingStepCardProps) {\n const [isProcessing, setIsProcessing] = React.useState(false);\n\n const handleAction = async (e: React.MouseEvent) => {\n e.stopPropagation();\n setIsProcessing(true);\n try {\n await onAction();\n } finally {\n setIsProcessing(false);\n }\n };\n\n const handleSkip = (e: React.MouseEvent) => {\n e.stopPropagation();\n onSkip();\n };\n\n return (\n <InteractiveCard\n clickable={false}\n className={cn(\n 'rounded-[6px] border border-ods-border bg-ods-card',\n 'flex flex-col md:flex-row',\n 'min-h-[80px] md:h-[80px]',\n 'items-start md:items-center',\n 'gap-3 md:gap-4',\n 'px-4 py-4 md:py-0',\n className,\n )}\n >\n {/* Left column - content */}\n <div className=\"flex w-full min-w-0 flex-1 flex-col justify-center gap-1 md:w-auto\">\n <h3 className=\"truncate text-ods-text-primary text-h4\" title={step.title}>\n {step.title}\n </h3>\n <p className=\"h-[20px] truncate text-ods-text-secondary text-h6\" title={step.description}>\n {step.description}\n </p>\n </div>\n\n {/* Right column - action buttons, completed badge, or skipped badge */}\n <div\n className=\"flex w-full shrink-0 items-center justify-start gap-2 md:w-auto md:justify-end\"\n onClick={e => e.stopPropagation()}\n >\n {isCheckingCompletion ? (\n <>\n <div className=\"h-[32px] w-[100px] animate-pulse rounded-[6px] bg-ods-border\" />\n <div className=\"h-[32px] w-[120px] animate-pulse rounded-[6px] bg-ods-border\" />\n </>\n ) : isCompleted ? (\n <>\n <StatusBadge text=\"COMPLETED\" variant=\"card\" colorScheme=\"success\" />\n <Button\n variant=\"outline\"\n onClick={handleAction}\n disabled={isProcessing}\n leftIcon={step.actionIcon('white')}\n >\n {step.completedText}\n </Button>\n </>\n ) : isSkipped ? (\n <>\n <StatusBadge text=\"SKIPPED\" variant=\"card\" colorScheme=\"default\" />\n </>\n ) : (\n <>\n <Button variant=\"outline\" onClick={handleSkip}>\n Skip Step\n </Button>\n <Button variant=\"accent\" onClick={handleAction} disabled={isProcessing} leftIcon={step.actionIcon('black')}>\n {step.actionText}\n </Button>\n </>\n )}\n </div>\n </InteractiveCard>\n );\n}\n","'use client';\n\nimport React, { useRef, useCallback } from 'react';\nimport { useOnboardingState, type OnboardingStepConfig } from '../../../hooks/ui/use-onboarding-state';\nimport { cn } from '../../../utils/cn';\nimport { SECTION_HEADING_CLASS } from '../../layout/page-heading';\nimport { Button } from '../../ui/button';\nimport { OnboardingStepCard } from './onboarding-step-card';\n\nexport interface OnboardingWalkthroughProps {\n steps: OnboardingStepConfig[];\n /** Heading above the steps. Defaults to \"Get Started\". */\n title?: string;\n /**\n * What to render once the walkthrough is dismissed. Receives `restart`,\n * which clears every completed/skipped step and shows the walkthrough\n * again. Omitted: a dismissed walkthrough renders nothing.\n */\n renderDismissed?: (restart: () => void) => React.ReactNode;\n onDismiss?: () => void;\n storageKey?: string;\n className?: string;\n spacing?: string;\n /**\n * Completion status from hook-based checks (e.g., useOnboardingCompletion)\n * Object mapping step IDs to boolean completion status\n */\n completionStatus?: Record<string, boolean>;\n /**\n * Whether completion checks are still loading\n */\n isLoadingCompletion?: boolean;\n}\n\nexport function OnboardingWalkthrough({\n steps,\n title = 'Get Started',\n renderDismissed,\n onDismiss,\n storageKey = 'openframe-onboarding-state',\n className,\n spacing = 'space-y-4',\n completionStatus,\n isLoadingCompletion = false,\n}: OnboardingWalkthroughProps) {\n const {\n state,\n markComplete,\n markSkipped,\n dismissOnboarding,\n resetOnboarding,\n isStepComplete,\n isStepSkipped,\n allStepsComplete,\n markMultipleComplete,\n } = useOnboardingState(storageKey);\n\n // Refs to prevent race conditions - ALL refs must be declared before any conditional returns\n const hasAutoMarkedRef = useRef(false);\n const autoMarkingInProgressRef = useRef(false);\n const lastCompletionStatusRef = useRef<string | null>(null);\n // Ref to track in-flight action handlers - moved here to be before conditional return\n const actionInProgressRef = useRef<Set<string>>(new Set());\n\n // Sync completion status from hooks to localStorage\n // Uses refs to prevent duplicate calls and race conditions\n React.useEffect(() => {\n // Skip if still loading\n if (isLoadingCompletion) {\n hasAutoMarkedRef.current = false; // Reset when loading starts\n return;\n }\n\n // Skip if no completion status\n if (!completionStatus) return;\n\n // Create a stable key from completion status to detect actual changes.\n // An empty state (first load, or after a restart) is keyed by when it was\n // written, so a restart applies the same status again.\n const isFreshState = state.completedSteps.length === 0 && state.skippedSteps.length === 0;\n const statusKey = `${JSON.stringify(completionStatus)}|${isFreshState ? state.lastUpdated : ''}`;\n\n // Skip if we've already processed this exact status\n if (lastCompletionStatusRef.current === statusKey) return;\n\n // Skip if auto-marking is currently in progress\n if (autoMarkingInProgressRef.current) return;\n\n // Find steps that need to be marked complete\n // Read directly from state to avoid stale closure issues\n const completedStepIds = Object.entries(completionStatus)\n .filter(([stepId, isComplete]) => {\n if (!isComplete) return false;\n // Check against current state, not the callback\n return !state.completedSteps.includes(stepId);\n })\n .map(([stepId]) => stepId);\n\n if (completedStepIds.length > 0) {\n // Mark as in progress to prevent concurrent calls\n autoMarkingInProgressRef.current = true;\n\n markMultipleComplete(completedStepIds);\n\n // Update the last processed status key\n lastCompletionStatusRef.current = statusKey;\n\n // Reset the in-progress flag after a short delay\n // This prevents rapid successive calls while allowing future updates\n setTimeout(() => {\n autoMarkingInProgressRef.current = false;\n }, 100);\n } else {\n // Even if no steps to mark, update the status key to prevent re-processing\n lastCompletionStatusRef.current = statusKey;\n }\n }, [\n completionStatus,\n isLoadingCompletion,\n state.completedSteps,\n state.skippedSteps,\n state.lastUpdated,\n markMultipleComplete,\n ]);\n\n // useCallback must be called unconditionally (before any early returns)\n const handleStepAction = useCallback(\n async (step: OnboardingStepConfig) => {\n // Prevent duplicate action handling for the same step\n if (actionInProgressRef.current.has(step.id)) {\n return;\n }\n\n // Mark as in progress\n actionInProgressRef.current.add(step.id);\n\n try {\n await step.onAction();\n\n // Skip if already completed (could have been auto-marked while action was running)\n if (state.completedSteps.includes(step.id)) {\n return;\n }\n\n // Auto-mark Knowledge Base as complete (no verification needed)\n if (step.id === 'knowledge-base') {\n markComplete(step.id);\n return;\n }\n\n // For other steps, re-check completion after action\n if (step.checkComplete) {\n try {\n const isComplete = await step.checkComplete();\n\n // Double-check it wasn't completed while we were checking\n if (isComplete && !state.completedSteps.includes(step.id)) {\n markComplete(step.id);\n }\n } catch (error) {\n console.error(`Error checking completion for \"${step.id}\":`, error);\n }\n }\n } finally {\n // Remove from in-progress set\n actionInProgressRef.current.delete(step.id);\n }\n },\n [state.completedSteps, markComplete],\n );\n\n const handleStepSkip = (step: OnboardingStepConfig) => {\n step.onSkip?.();\n markSkipped(step.id);\n };\n\n const handleDismiss = () => {\n dismissOnboarding();\n onDismiss?.();\n };\n\n // ALL hooks have been called above - now safe to do conditional returns\n // Don't render if dismissed\n if (state.dismissed) {\n return renderDismissed ? <>{renderDismissed(resetOnboarding)}</> : null;\n }\n\n const isAllComplete = allStepsComplete(steps);\n\n return (\n <div className={cn('w-full space-y-4', className)}>\n {/* Header - responsive: stacks on mobile */}\n <div className=\"flex flex-col items-start justify-between gap-3 md:flex-row md:items-center md:gap-0\">\n <h2 className={SECTION_HEADING_CLASS}>{title}</h2>\n\n {isLoadingCompletion ? (\n <div className=\"h-[48px] w-full animate-pulse rounded-[6px] bg-ods-border md:w-[160px]\" />\n ) : isAllComplete ? (\n <Button variant=\"accent\" onClick={handleDismiss} className=\"w-full md:w-auto\">\n Close Onboarding\n </Button>\n ) : (\n <Button variant=\"outline\" onClick={handleDismiss} className=\"w-full md:w-auto\">\n Skip Onboarding\n </Button>\n )}\n </div>\n\n {/* Step cards - no wrapper, direct rendering */}\n <div className={cn(spacing)}>\n {steps.map(step => (\n <OnboardingStepCard\n key={step.id}\n step={step}\n isCompleted={isStepComplete(step.id)}\n isSkipped={isStepSkipped(step.id)}\n isCheckingCompletion={isLoadingCompletion}\n onAction={() => handleStepAction(step)}\n onSkip={() => handleStepSkip(step)}\n />\n ))}\n </div>\n </div>\n );\n}\n"]}
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
|
|
11
|
-
var
|
|
11
|
+
var _chunkLSY7OGTCcjs = require('./chunk-LSY7OGTC.cjs');
|
|
12
12
|
|
|
13
13
|
|
|
14
14
|
|
|
@@ -19,7 +19,7 @@ var _chunkP22VEIWQcjs = require('./chunk-P22VEIWQ.cjs');
|
|
|
19
19
|
|
|
20
20
|
|
|
21
21
|
|
|
22
|
-
var
|
|
22
|
+
var _chunkHTIOL44Ccjs = require('./chunk-HTIOL44C.cjs');
|
|
23
23
|
|
|
24
24
|
|
|
25
25
|
|
|
@@ -110,7 +110,7 @@ function ContactForm({
|
|
|
110
110
|
successToastMessage = "Redirecting you to join our community...",
|
|
111
111
|
rescue: rescueForm = null
|
|
112
112
|
} = {}) {
|
|
113
|
-
const attachments =
|
|
113
|
+
const attachments = _chunkHTIOL44Ccjs.useChatAttachments.call(void 0, );
|
|
114
114
|
const builtInSubmission = _chunkP22VEIWQcjs.useContactSubmission.call(void 0, {
|
|
115
115
|
userId,
|
|
116
116
|
successRedirectUrl,
|
|
@@ -181,7 +181,7 @@ function ContactForm({
|
|
|
181
181
|
className: `flex h-full flex-col ${!noBorder ? "rounded-2xl border border-ods-border md:rounded-3xl" : ""} ${!noPadding ? "p-6 md:p-8 lg:p-10" : ""}`,
|
|
182
182
|
children: [
|
|
183
183
|
(title || subtitle) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mb-6 md:mb-8", children: [
|
|
184
|
-
title && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: `${
|
|
184
|
+
title && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: `${_chunkHTIOL44Ccjs.SECTION_HEADING_CLASS} mb-3 md:mb-4`, children: title }),
|
|
185
185
|
subtitle && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-ods-text-primary text-h4", children: subtitle })
|
|
186
186
|
] }),
|
|
187
187
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
@@ -194,13 +194,13 @@ function ContactForm({
|
|
|
194
194
|
);
|
|
195
195
|
}),
|
|
196
196
|
className: "flex flex-grow flex-col space-y-4 md:space-y-6",
|
|
197
|
-
...
|
|
197
|
+
..._chunkLSY7OGTCcjs.HUBSPOT_DO_NOT_COLLECT_FORM_PROPS,
|
|
198
198
|
children: [
|
|
199
199
|
!showName && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", { type: "hidden", ...register("name") }),
|
|
200
200
|
!showEmail && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", { type: "hidden", ...register("email") }),
|
|
201
201
|
!showHelpCategory && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", { type: "hidden", ...register("helpCategory") }),
|
|
202
202
|
!showMessage && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", { type: "hidden", ...register("message") }),
|
|
203
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
203
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.HoneypotField, { ...honeypotInputProps }),
|
|
204
204
|
extraTopField,
|
|
205
205
|
showNameEmailRow && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6", children: [
|
|
206
206
|
showName && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col", children: [
|
|
@@ -252,17 +252,17 @@ function ContactForm({
|
|
|
252
252
|
{
|
|
253
253
|
control,
|
|
254
254
|
name: "companySize",
|
|
255
|
-
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
255
|
+
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkLSY7OGTCcjs.Select, { onValueChange: field.onChange, value: _nullishCoalesce(field.value, () => ( "")), children: [
|
|
256
256
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
257
|
-
|
|
257
|
+
_chunkLSY7OGTCcjs.SelectTrigger,
|
|
258
258
|
{
|
|
259
259
|
id: "companySize",
|
|
260
260
|
"aria-label": "Company Size",
|
|
261
261
|
className: "h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary",
|
|
262
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
262
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectValue, { placeholder: "Select company size" })
|
|
263
263
|
}
|
|
264
264
|
),
|
|
265
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
265
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectContent, { children: companySizeOptions.map((opt) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectItem, { value: opt, children: opt }, opt)) })
|
|
266
266
|
] })
|
|
267
267
|
}
|
|
268
268
|
),
|
|
@@ -275,17 +275,17 @@ function ContactForm({
|
|
|
275
275
|
{
|
|
276
276
|
control,
|
|
277
277
|
name: "referralSource",
|
|
278
|
-
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
278
|
+
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkLSY7OGTCcjs.Select, { onValueChange: field.onChange, value: _nullishCoalesce(field.value, () => ( "")), children: [
|
|
279
279
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
280
|
-
|
|
280
|
+
_chunkLSY7OGTCcjs.SelectTrigger,
|
|
281
281
|
{
|
|
282
282
|
id: "referralSource",
|
|
283
283
|
"aria-label": "Referral Source",
|
|
284
284
|
className: "h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary",
|
|
285
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
285
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectValue, { placeholder: "Select an option" })
|
|
286
286
|
}
|
|
287
287
|
),
|
|
288
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
288
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectContent, { children: referralSourceOptions.map((opt) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectItem, { value: opt, children: opt }, opt)) })
|
|
289
289
|
] })
|
|
290
290
|
}
|
|
291
291
|
),
|
|
@@ -302,18 +302,18 @@ function ContactForm({
|
|
|
302
302
|
{
|
|
303
303
|
control,
|
|
304
304
|
name: "helpCategory",
|
|
305
|
-
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
305
|
+
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkLSY7OGTCcjs.Select, { onValueChange: field.onChange, value: _nullishCoalesce(field.value, () => ( "")), children: [
|
|
306
306
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
307
|
-
|
|
307
|
+
_chunkLSY7OGTCcjs.SelectTrigger,
|
|
308
308
|
{
|
|
309
309
|
id: "helpCategory",
|
|
310
310
|
"aria-label": "Help Category",
|
|
311
311
|
"aria-required": true,
|
|
312
312
|
className: "h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary",
|
|
313
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
313
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectValue, { placeholder: "Choose your main interest" })
|
|
314
314
|
}
|
|
315
315
|
),
|
|
316
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
316
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectContent, { children: helpCategoryOptions.map((opt) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSY7OGTCcjs.SelectItem, { value: opt, children: opt }, opt)) })
|
|
317
317
|
] })
|
|
318
318
|
}
|
|
319
319
|
),
|
|
@@ -325,7 +325,7 @@ function ContactForm({
|
|
|
325
325
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkKWX65373cjs.RequiredMark, {})
|
|
326
326
|
] }),
|
|
327
327
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
328
|
-
|
|
328
|
+
_chunkLSY7OGTCcjs.Textarea,
|
|
329
329
|
{
|
|
330
330
|
id: "message",
|
|
331
331
|
...register("message"),
|
|
@@ -340,7 +340,7 @@ function ContactForm({
|
|
|
340
340
|
] }),
|
|
341
341
|
attachmentsEnabled && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-2", children: [
|
|
342
342
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
343
|
-
|
|
343
|
+
_chunkHTIOL44Ccjs.ChatAttachmentChipStrip,
|
|
344
344
|
{
|
|
345
345
|
attachments: attachments.attachments,
|
|
346
346
|
onRemove: attachments.removeAttachment,
|
|
@@ -349,7 +349,7 @@ function ContactForm({
|
|
|
349
349
|
),
|
|
350
350
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
|
|
351
351
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
352
|
-
|
|
352
|
+
_chunkHTIOL44Ccjs.ChatAttachmentAddButton,
|
|
353
353
|
{
|
|
354
354
|
attachmentsEnabled: true,
|
|
355
355
|
attachmentsCount: attachments.attachments.length,
|
|
@@ -385,4 +385,4 @@ function ContactForm({
|
|
|
385
385
|
|
|
386
386
|
|
|
387
387
|
exports.ContactForm = ContactForm;
|
|
388
|
-
//# sourceMappingURL=chunk-
|
|
388
|
+
//# sourceMappingURL=chunk-YTVZJNJ7.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-ERTG6C5E.cjs","../src/components/contact/contact-form.tsx","../src/schemas/contact-schema.ts"],"names":[],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-ERTG6C5E.cjs","sourcesContent":[null,"'use client';\n\n/**\n * `<ContactForm />` — the canonical contact form used by every public\n * surface (TMCG join, case-study pitch, generic /contact, Help Center\n * ticket creation, etc.).\n *\n * Self-contained inside the lib — host-specific values (user id for\n * tracking, platform-specific contact reasons, reddit-click attribution\n * id) flow IN via props. The hub passes them via a thin\n * `<ContactForm>` wrapper that resolves them from `useAuth` /\n * `getAppConfig` / `getStoredRedditClickId`. Other embedders pass\n * whatever they have (or omit).\n *\n * Field-hide + custom-submit + extra-top-field knobs let one form\n * serve both contact and ticket-creation flows without forking:\n * - Contact page: rendered with all fields visible, built-in submit\n * flow to `/api/contact` via `useContactSubmission`.\n * - Ticket page: hides name/email/companySize/referralSource/\n * helpCategory; supplies `extraTopField` (a Subject input) +\n * `onCustomSubmit` wired to `useTicketActions.submitTicket`.\n */\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { useMemo, useState, type ReactNode } from 'react';\nimport { useForm, Controller } from 'react-hook-form';\nimport { useContactSubmission } from '../../hooks/use-contact-submission';\nimport { useHumanitySignals } from '../../hooks/use-humanity-signals';\nimport { useRescuedForm } from '../../hooks/use-rescued-form';\nimport {\n ContactSchema,\n type ContactFormData,\n companySizeOptions,\n referralSourceOptions,\n defaultHelpCategoryOptions,\n} from '../../schemas/contact-schema';\nimport type { FormRescueDefinition } from '../../utils/form-rescue';\nimport { HUBSPOT_DO_NOT_COLLECT_FORM_PROPS } from '../../utils/hubspot-collected-forms';\nimport { ChatAttachmentAddButton, ChatAttachmentChipStrip } from '../chat/chat-attachment-bar';\nimport { useChatAttachments } from '../chat/hooks/use-chat-attachments';\nimport type { ChatAttachment } from '../chat/utils/chat-attachment-markdown';\nimport { SECTION_HEADING_CLASS } from '../layout/page-heading';\nimport {\n Button,\n type ButtonProps,\n Input,\n Textarea,\n Select,\n SelectTrigger,\n SelectValue,\n SelectContent,\n SelectItem,\n Label,\n} from '../ui';\nimport { HoneypotField } from '../ui/honeypot-field';\nimport { RequiredMark } from '../ui/required-mark';\n\n/**\n * Fields the caller can suppress. Six values — every primary form\n * field plus `name` and `email` (newly hideable so ticket-creation\n * surfaces can hide them; they still need to validate, so the caller\n * MUST supply pre-filled values via `defaultValues` when hiding them).\n */\nexport type ContactFormHideableField = 'name' | 'email' | 'companySize' | 'referralSource' | 'helpCategory' | 'message';\n\nexport interface ContactFormProps {\n /** Host-side user id passed to `useContactSubmission` for attribution.\n * Hub wrapper passes `useAuth().user?.id`; lib's Help Center surface\n * passes `useChatIdentity().user?.id`. Omit for anon flows. */\n userId?: string;\n /** Platform-specific help-category dropdown options. Hub wrapper\n * passes `getAppConfig().contact.contactReasons`. Defaults to the\n * lib's `defaultHelpCategoryOptions`. */\n helpCategoryOptions?: readonly string[];\n /** Reddit click attribution id. Caller resolves from wherever they\n * stash it (hub: sessionStorage via `getStoredRedditClickId`). When\n * set, it's spread into the submission payload. */\n rdtCid?: string;\n /** Called after a successful submit so the caller can clear their\n * attribution storage (hub wrapper calls `clearStoredRedditClickId`).\n * Fires for BOTH the built-in and custom submit paths. */\n onSubmitSuccess?: () => void;\n\n prefilledReason?: string;\n prefilledMessage?: string;\n hideFields?: ContactFormHideableField[];\n /** Authoritative pre-fill for any field the caller hides. Merged\n * into react-hook-form's `defaultValues` AFTER the legacy\n * `prefilledReason` / `prefilledMessage` props (caller-supplied\n * wins). REQUIRED when hiding `name` / `email` / `helpCategory` —\n * those fields are still validated by Zod even when not rendered. */\n defaultValues?: Partial<ContactFormData>;\n /** Optional custom submit handler. When provided, the form bypasses\n * the built-in `useContactSubmission` flow (no /api/contact call,\n * no success-redirect, no built-in toast) — the caller owns the\n * entire side-effect chain. Reset + `onSubmitSuccess` still fire\n * on a successful await.\n *\n * Receives the schema-validated form payload PLUS the ready\n * attachments array (empty when `attachmentsEnabled === false` or\n * the user hasn't picked any). Caller forwards `attachments` to\n * whichever sink owns the upload (e.g. `actions.submitTicket`'s\n * `attachments` field for HubSpot Note engagements). */\n onCustomSubmit?: (data: ContactFormData, attachments: ChatAttachment[]) => Promise<void>;\n /** Turn on the attachments bar (file `+` button + chip strip) using\n * the same lib primitives the chat composer uses\n * (`<ChatAttachmentAddButton>` + `<ChatAttachmentChipStrip>` +\n * `useChatAttachments`). When `false` (the default), the form\n * doesn't render the bar AND the attachments array passed to\n * `onCustomSubmit` is always empty. */\n attachmentsEnabled?: boolean;\n /** Render slot for an EXTRA field at the very top of the form,\n * ABOVE the name/email row. Use this for ticket surfaces that need\n * a Subject input — the field is NOT part of `ContactSchema`, so\n * the caller manages its own state + validation and reads the\n * value back inside `onCustomSubmit`. */\n extraTopField?: ReactNode;\n\n title?: string;\n subtitle?: string;\n footerText?: string;\n noBorder?: boolean;\n noPadding?: boolean;\n buttonVariant?: ButtonProps['variant'];\n buttonClassName?: string;\n /** Submit-button label. Defaults to \"Send Message\". Override for\n * ticket surfaces (e.g. \"Open ticket\"). */\n submitLabel?: string;\n /** Success-state submit-button label (shown briefly after submit on\n * the built-in flow). Defaults to \"Message Sent!\". Has no effect\n * when `onCustomSubmit` is provided — the caller owns success UX. */\n submitSuccessLabel?: string;\n successRedirectUrl?: string;\n successToastMessage?: string;\n /** Form rescue (a half-filled form is saved so the team can follow up): the\n * form's definition (`RESCUE_FORMS.contact`, or the host's own\n * `defineRescueForm`). OPT-IN: omitted or `null` saves nothing, so a host that\n * has not chosen rescue never starts storing what visitors type. */\n rescue?: FormRescueDefinition | null;\n}\n\nexport function ContactForm({\n userId,\n helpCategoryOptions = defaultHelpCategoryOptions,\n rdtCid,\n onSubmitSuccess,\n prefilledReason,\n prefilledMessage,\n hideFields = [],\n defaultValues: defaultValuesProp,\n onCustomSubmit,\n extraTopField,\n attachmentsEnabled = false,\n title = 'Hit Us Up',\n subtitle,\n footerText = 'We typically respond within 24 hours. We respect your privacy – no spam, ever.',\n noBorder = false,\n noPadding = false,\n buttonVariant = 'accent',\n buttonClassName = '',\n submitLabel = 'Send Message',\n submitSuccessLabel = 'Message Sent!',\n successRedirectUrl = '/blog#community',\n successToastMessage = 'Redirecting you to join our community...',\n rescue: rescueForm = null,\n}: ContactFormProps = {}) {\n // Attachments staging — same hook the chat composer + ticket\n // detail-drawer composer use. Files upload to Supabase as soon as\n // the user picks them; `readyAttachments` is the wire-shape array\n // ready for the next submit. `hasInflightUploads` disables Send\n // until every upload settles.\n const attachments = useChatAttachments();\n // Built-in contact-API flow. Hook is called unconditionally (rules\n // of hooks); we just don't dispatch its `submit` when the caller\n // passes `onCustomSubmit`. The hook owns its own toast + redirect\n // chain so bypassing it cleanly hands all side-effects to the caller.\n const builtInSubmission = useContactSubmission({\n userId,\n successRedirectUrl,\n successToastMessage,\n });\n // Independent in-flight tracker for the custom path — we can't reuse\n // `builtInSubmission.isSubmitting` because that hook never sees a\n // request when `onCustomSubmit` is active.\n const [customSubmitting, setCustomSubmitting] = useState(false);\n\n // Invisible bot-protection signals (honeypot + timing). Spread into the\n // submit payload for BOTH the built-in and custom paths; reset on success.\n const { honeypotInputProps, getSignals, resetSignals } = useHumanitySignals();\n\n const isSubmitting = onCustomSubmit ? customSubmitting : builtInSubmission.isSubmitting;\n // `isSuccess` only ever fires on the built-in path; custom callers\n // own their own UX (no \"Message Sent!\" button-label flicker).\n const isSuccess = onCustomSubmit ? false : builtInSubmission.isSuccess;\n\n const form = useForm<ContactFormData>({\n resolver: zodResolver(ContactSchema),\n defaultValues: {\n ...(prefilledReason && { helpCategory: prefilledReason }),\n ...(prefilledMessage && { message: prefilledMessage }),\n // Caller-supplied defaults win over the legacy `prefilled*` props\n // (they're the authoritative seed for hidden fields).\n ...defaultValuesProp,\n },\n });\n const {\n register,\n handleSubmit,\n control,\n formState: { errors },\n reset,\n } = form;\n\n // Form rescue: only the fields the visitor can see are tracked, so a hidden\n // prefilled value (a signed-in email, a fixed category) is never sent.\n const rescueFieldNames = useMemo(\n () =>\n (['name', 'email', 'companySize', 'referralSource', 'helpCategory', 'message'] as const).filter(\n field => !hideFields.includes(field),\n ),\n [hideFields],\n );\n const rescue = useRescuedForm(form, { rescue: rescueForm, fields: rescueFieldNames, getSignals });\n\n const handleFormSubmit = async (data: ContactFormData) => {\n if (isSubmitting) return;\n if (attachmentsEnabled && attachments.hasInflightUploads) return;\n try {\n const payload = { ...data, ...(rdtCid && { rdt_cid: rdtCid }), ...getSignals(), ...rescue.submitFields() };\n const readyAttachments = attachmentsEnabled ? attachments.readyAttachments : [];\n if (onCustomSubmit) {\n setCustomSubmitting(true);\n try {\n await onCustomSubmit(payload, readyAttachments);\n } finally {\n setCustomSubmitting(false);\n }\n } else {\n await builtInSubmission.submit(payload);\n }\n rescue.complete();\n onSubmitSuccess?.();\n reset();\n resetSignals();\n if (attachmentsEnabled) attachments.clear();\n } catch {\n // Error toast is owned by the active flow:\n // - built-in: `useContactSubmission` toasts inside `submit()`.\n // - custom: the caller toasts inside `onCustomSubmit`.\n // Either way we swallow here so a thrown error doesn't crash the\n // form tree (react-hook-form's onSubmit handler rejects upward).\n }\n };\n\n const showName = !hideFields.includes('name');\n const showEmail = !hideFields.includes('email');\n const showNameEmailRow = showName || showEmail;\n const showCompanySize = !hideFields.includes('companySize');\n const showReferralSource = !hideFields.includes('referralSource');\n const showHelpCategory = !hideFields.includes('helpCategory');\n const showMessage = !hideFields.includes('message');\n\n return (\n <div\n className={`flex h-full flex-col ${!noBorder ? 'rounded-2xl border border-ods-border md:rounded-3xl' : ''} ${!noPadding ? 'p-6 md:p-8 lg:p-10' : ''}`}\n >\n {(title || subtitle) && (\n <div className=\"mb-6 md:mb-8\">\n {title && <h2 className={`${SECTION_HEADING_CLASS} mb-3 md:mb-4`}>{title}</h2>}\n {subtitle && <p className=\"text-ods-text-primary text-h4\">{subtitle}</p>}\n </div>\n )}\n\n <form\n onSubmit={handleSubmit(handleFormSubmit, validationErrors => {\n // When validation fails on a HIDDEN field (e.g. ticket form\n // hides name/email/helpCategory and seeds them via\n // `defaultValues`), there's no visible error UI for the user\n // — the submit button just appears dead. Log so the broken\n // defaultValues wiring is at least discoverable in DevTools.\n console.warn(\n '[ContactForm] submit blocked by validation:',\n Object.fromEntries(Object.entries(validationErrors).map(([k, v]) => [k, v?.message ?? v])),\n );\n })}\n className=\"flex flex-grow flex-col space-y-4 md:space-y-6\"\n {...HUBSPOT_DO_NOT_COLLECT_FORM_PROPS}\n >\n {/* Hidden inputs for fields that are required by `ContactSchema`\n but suppressed from the visible UI via `hideFields`. Without\n these, `register('name')` never runs, react-hook-form skips\n the field at submit time, and Zod's required-string check\n fails silently — the user clicks Submit and NOTHING visible\n happens (no error, no network call). The caller-supplied\n `defaultValues` seed the values; the hidden inputs just tell\n RHF to include them in the submit payload. */}\n {!showName && <input type=\"hidden\" {...register('name')} />}\n {!showEmail && <input type=\"hidden\" {...register('email')} />}\n {!showHelpCategory && <input type=\"hidden\" {...register('helpCategory')} />}\n {!showMessage && <input type=\"hidden\" {...register('message')} />}\n\n {/* Invisible honeypot — real users never fill it; bots that fill every field trip it. */}\n <HoneypotField {...honeypotInputProps} />\n\n {/* Extra top field (e.g. Subject for ticket forms). Rendered\n outside the schema-driven layout so the caller fully owns\n label / placeholder / state. */}\n {extraTopField}\n\n {showNameEmailRow && (\n <div className=\"grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6\">\n {showName && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"name\">\n Your Name\n <RequiredMark />\n </Label>\n <Input\n id=\"name\"\n type=\"text\"\n {...register('name')}\n placeholder=\"Jane Doe\"\n aria-invalid={!!errors.name}\n aria-required\n aria-describedby=\"name-error\"\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary placeholder-ods-text-secondary\"\n />\n {errors.name && (\n <span id=\"name-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.name.message}\n </span>\n )}\n </div>\n )}\n {showEmail && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"email\">\n Email\n <RequiredMark />\n </Label>\n <Input\n id=\"email\"\n type=\"email\"\n {...register('email')}\n placeholder=\"jane@company.com\"\n aria-invalid={!!errors.email}\n aria-required\n aria-describedby=\"email-error\"\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary placeholder-ods-text-secondary\"\n />\n {errors.email && (\n <span id=\"email-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.email.message}\n </span>\n )}\n </div>\n )}\n </div>\n )}\n\n {(showCompanySize || showReferralSource) && (\n <div className=\"grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6\">\n {showCompanySize && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"companySize\">Company Size</Label>\n <Controller\n control={control}\n name=\"companySize\"\n render={({ field }) => (\n <Select onValueChange={field.onChange} value={field.value ?? ''}>\n <SelectTrigger\n id=\"companySize\"\n aria-label=\"Company Size\"\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary\"\n >\n <SelectValue placeholder=\"Select company size\" />\n </SelectTrigger>\n <SelectContent>\n {companySizeOptions.map(opt => (\n <SelectItem key={opt} value={opt}>\n {opt}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n )}\n />\n {errors.companySize && (\n <span id=\"companySize-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.companySize.message}\n </span>\n )}\n </div>\n )}\n {showReferralSource && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"referralSource\">How did you hear about us?</Label>\n <Controller\n control={control}\n name=\"referralSource\"\n render={({ field }) => (\n <Select onValueChange={field.onChange} value={field.value ?? ''}>\n <SelectTrigger\n id=\"referralSource\"\n aria-label=\"Referral Source\"\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary\"\n >\n <SelectValue placeholder=\"Select an option\" />\n </SelectTrigger>\n <SelectContent>\n {referralSourceOptions.map(opt => (\n <SelectItem key={opt} value={opt}>\n {opt}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n )}\n />\n {errors.referralSource && (\n <span id=\"referralSource-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.referralSource.message}\n </span>\n )}\n </div>\n )}\n </div>\n )}\n\n {showHelpCategory && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"helpCategory\">\n Choose your main interest\n <RequiredMark />\n </Label>\n <Controller\n control={control}\n name=\"helpCategory\"\n render={({ field }) => (\n <Select onValueChange={field.onChange} value={field.value ?? ''}>\n <SelectTrigger\n id=\"helpCategory\"\n aria-label=\"Help Category\"\n aria-required\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary\"\n >\n <SelectValue placeholder=\"Choose your main interest\" />\n </SelectTrigger>\n <SelectContent>\n {helpCategoryOptions.map(opt => (\n <SelectItem key={opt} value={opt}>\n {opt}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n )}\n />\n {errors.helpCategory && (\n <span id=\"helpCategory-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.helpCategory.message}\n </span>\n )}\n </div>\n )}\n\n {showMessage && (\n <div className=\"flex flex-grow flex-col\">\n <Label htmlFor=\"message\">\n Your Message\n <RequiredMark />\n </Label>\n <Textarea\n id=\"message\"\n {...register('message')}\n placeholder=\"Share your current challenges or questions about open-source alternatives...\"\n aria-invalid={!!errors.message}\n aria-required\n aria-describedby=\"message-error\"\n className=\"h-full flex-grow border-ods-border bg-ods-card text-ods-text-primary placeholder-ods-text-secondary\"\n />\n {errors.message && (\n <span id=\"message-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.message.message}\n </span>\n )}\n </div>\n )}\n\n {/* Attachments — only renders when `attachmentsEnabled` is on.\n Uses the SAME chip strip + add button + staging hook the\n chat composer and ticket-drawer composer use, so the visual\n chip styling + upload-progress UX are identical everywhere\n attachments appear. */}\n {attachmentsEnabled && (\n <div className=\"flex flex-col gap-2\">\n <ChatAttachmentChipStrip\n attachments={attachments.attachments}\n onRemove={attachments.removeAttachment}\n disabled={isSubmitting}\n />\n <div className=\"flex items-center gap-2\">\n <ChatAttachmentAddButton\n attachmentsEnabled\n attachmentsCount={attachments.attachments.length}\n onAddFiles={attachments.addFiles}\n disabled={isSubmitting}\n />\n <span className=\"text-ods-text-secondary text-h6\">Attach files (optional)</span>\n </div>\n </div>\n )}\n\n <div className=\"mt-auto flex w-full flex-col items-center justify-end gap-4 pt-2 md:flex-row md:gap-6\">\n {footerText && <p className=\"text-center text-ods-text-secondary text-h6 md:text-left\">{footerText}</p>}\n <Button\n type=\"submit\"\n loading={isSubmitting}\n disabled={isSubmitting || isSuccess || (attachmentsEnabled && attachments.hasInflightUploads)}\n variant={buttonVariant}\n className={`w-full md:w-auto ${buttonClassName}`}\n >\n {isSuccess ? submitSuccessLabel : submitLabel}\n </Button>\n </div>\n </form>\n </div>\n );\n}\n","import { z } from 'zod';\n\n// Dropdown option constants — re-exported by `<ContactForm>` consumers\n// that want to surface their own custom Select widgets keyed on the\n// same allowed-value set.\nexport const companySizeOptions = ['1-10', '11-50', '51-200', '201-500', '501-1000', '1001+'] as const;\n\nexport const referralSourceOptions = [\n 'Google',\n 'LinkedIn',\n 'Twitter/X',\n 'Reddit',\n 'Friend / Colleague',\n 'Other',\n] as const;\n\n// Default fallback options — used when the embedder doesn't supply\n// platform-specific help-category options via the `helpCategoryOptions`\n// prop on `<ContactForm>`.\nexport const defaultHelpCategoryOptions = [\n 'Open-Source Alternatives',\n 'Vendor Cost Reduction',\n 'MSP Best Practices',\n 'Partnerships',\n 'Press',\n 'Other',\n] as const;\n\n// Reusable LinkedIn URL validator — the single source of truth. Every\n// public form schema, every admin update schema, every HubSpot push\n// validator MUST reference this so validation rules cannot drift\n// across boundaries.\n//\n// Host validation parses the URL and checks the hostname suffix so an\n// adversarial input like `https://evil.com/linkedin.com/x` is rejected\n// (substring match would have accepted it — CodeQL alert\n// \"Incomplete URL substring sanitization\").\nexport const LinkedInUrlSchema = z\n .string()\n .url({ message: 'Please enter a valid LinkedIn URL' })\n .refine(\n url => {\n try {\n const host = new URL(url).hostname.toLowerCase();\n return host === 'linkedin.com' || host.endsWith('.linkedin.com');\n } catch {\n return false;\n }\n },\n {\n message: 'Please enter a valid LinkedIn profile URL',\n },\n )\n .optional()\n .or(z.literal(''));\n\n/**\n * Base schema — fields shared by every contact-style form (main contact\n * form, TMCG join, data-room request, case-study pitch, etc.). Any\n * field that exists on a form but NOT on this schema is silently\n * stripped by `safeParse` — that's exactly the bug the LinkedIn field\n * hit historically.\n */\nexport const ContactBaseSchema = z.object({\n name: z.string().min(2, { message: 'Name must be at least 2 characters' }).max(255, { message: 'Name is too long' }),\n email: z.string().email({ message: 'Please enter a valid email address' }).max(255),\n linkedin_url: LinkedInUrlSchema,\n helpCategory: z\n .string()\n .min(1, { message: 'Please select what we can help you with' })\n .max(255, { message: 'Help category is too long' }),\n message: z\n .string()\n .min(10, { message: 'Message must be at least 10 characters' })\n .max(5000, { message: 'Message is too long (5,000 character limit)' }),\n rdt_cid: z.string().optional(),\n});\n\n// Public POST /api/contact validator — base + dropdown fields used by\n// the generic contact form. Other form-specific schemas extend\n// `ContactBaseSchema`.\nexport const ContactSchema = ContactBaseSchema.extend({\n companySize: z\n .string()\n .optional()\n .refine(val => !val || companySizeOptions.includes(val as (typeof companySizeOptions)[number]), {\n message: 'Please select a valid company size',\n }),\n referralSource: z\n .string()\n .optional()\n .refine(val => !val || referralSourceOptions.includes(val as (typeof referralSourceOptions)[number]), {\n message: 'Please select a valid referral source',\n }),\n});\n\nexport type ContactFormData = z.infer<typeof ContactSchema>;\n\nexport interface ContactApiResponse {\n success: boolean;\n error?: string;\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-YTVZJNJ7.cjs","../src/components/contact/contact-form.tsx","../src/schemas/contact-schema.ts"],"names":[],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-YTVZJNJ7.cjs","sourcesContent":[null,"'use client';\n\n/**\n * `<ContactForm />` — the canonical contact form used by every public\n * surface (TMCG join, case-study pitch, generic /contact, Help Center\n * ticket creation, etc.).\n *\n * Self-contained inside the lib — host-specific values (user id for\n * tracking, platform-specific contact reasons, reddit-click attribution\n * id) flow IN via props. The hub passes them via a thin\n * `<ContactForm>` wrapper that resolves them from `useAuth` /\n * `getAppConfig` / `getStoredRedditClickId`. Other embedders pass\n * whatever they have (or omit).\n *\n * Field-hide + custom-submit + extra-top-field knobs let one form\n * serve both contact and ticket-creation flows without forking:\n * - Contact page: rendered with all fields visible, built-in submit\n * flow to `/api/contact` via `useContactSubmission`.\n * - Ticket page: hides name/email/companySize/referralSource/\n * helpCategory; supplies `extraTopField` (a Subject input) +\n * `onCustomSubmit` wired to `useTicketActions.submitTicket`.\n */\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { useMemo, useState, type ReactNode } from 'react';\nimport { useForm, Controller } from 'react-hook-form';\nimport { useContactSubmission } from '../../hooks/use-contact-submission';\nimport { useHumanitySignals } from '../../hooks/use-humanity-signals';\nimport { useRescuedForm } from '../../hooks/use-rescued-form';\nimport {\n ContactSchema,\n type ContactFormData,\n companySizeOptions,\n referralSourceOptions,\n defaultHelpCategoryOptions,\n} from '../../schemas/contact-schema';\nimport type { FormRescueDefinition } from '../../utils/form-rescue';\nimport { HUBSPOT_DO_NOT_COLLECT_FORM_PROPS } from '../../utils/hubspot-collected-forms';\nimport { ChatAttachmentAddButton, ChatAttachmentChipStrip } from '../chat/chat-attachment-bar';\nimport { useChatAttachments } from '../chat/hooks/use-chat-attachments';\nimport type { ChatAttachment } from '../chat/utils/chat-attachment-markdown';\nimport { SECTION_HEADING_CLASS } from '../layout/page-heading';\nimport {\n Button,\n type ButtonProps,\n Input,\n Textarea,\n Select,\n SelectTrigger,\n SelectValue,\n SelectContent,\n SelectItem,\n Label,\n} from '../ui';\nimport { HoneypotField } from '../ui/honeypot-field';\nimport { RequiredMark } from '../ui/required-mark';\n\n/**\n * Fields the caller can suppress. Six values — every primary form\n * field plus `name` and `email` (newly hideable so ticket-creation\n * surfaces can hide them; they still need to validate, so the caller\n * MUST supply pre-filled values via `defaultValues` when hiding them).\n */\nexport type ContactFormHideableField = 'name' | 'email' | 'companySize' | 'referralSource' | 'helpCategory' | 'message';\n\nexport interface ContactFormProps {\n /** Host-side user id passed to `useContactSubmission` for attribution.\n * Hub wrapper passes `useAuth().user?.id`; lib's Help Center surface\n * passes `useChatIdentity().user?.id`. Omit for anon flows. */\n userId?: string;\n /** Platform-specific help-category dropdown options. Hub wrapper\n * passes `getAppConfig().contact.contactReasons`. Defaults to the\n * lib's `defaultHelpCategoryOptions`. */\n helpCategoryOptions?: readonly string[];\n /** Reddit click attribution id. Caller resolves from wherever they\n * stash it (hub: sessionStorage via `getStoredRedditClickId`). When\n * set, it's spread into the submission payload. */\n rdtCid?: string;\n /** Called after a successful submit so the caller can clear their\n * attribution storage (hub wrapper calls `clearStoredRedditClickId`).\n * Fires for BOTH the built-in and custom submit paths. */\n onSubmitSuccess?: () => void;\n\n prefilledReason?: string;\n prefilledMessage?: string;\n hideFields?: ContactFormHideableField[];\n /** Authoritative pre-fill for any field the caller hides. Merged\n * into react-hook-form's `defaultValues` AFTER the legacy\n * `prefilledReason` / `prefilledMessage` props (caller-supplied\n * wins). REQUIRED when hiding `name` / `email` / `helpCategory` —\n * those fields are still validated by Zod even when not rendered. */\n defaultValues?: Partial<ContactFormData>;\n /** Optional custom submit handler. When provided, the form bypasses\n * the built-in `useContactSubmission` flow (no /api/contact call,\n * no success-redirect, no built-in toast) — the caller owns the\n * entire side-effect chain. Reset + `onSubmitSuccess` still fire\n * on a successful await.\n *\n * Receives the schema-validated form payload PLUS the ready\n * attachments array (empty when `attachmentsEnabled === false` or\n * the user hasn't picked any). Caller forwards `attachments` to\n * whichever sink owns the upload (e.g. `actions.submitTicket`'s\n * `attachments` field for HubSpot Note engagements). */\n onCustomSubmit?: (data: ContactFormData, attachments: ChatAttachment[]) => Promise<void>;\n /** Turn on the attachments bar (file `+` button + chip strip) using\n * the same lib primitives the chat composer uses\n * (`<ChatAttachmentAddButton>` + `<ChatAttachmentChipStrip>` +\n * `useChatAttachments`). When `false` (the default), the form\n * doesn't render the bar AND the attachments array passed to\n * `onCustomSubmit` is always empty. */\n attachmentsEnabled?: boolean;\n /** Render slot for an EXTRA field at the very top of the form,\n * ABOVE the name/email row. Use this for ticket surfaces that need\n * a Subject input — the field is NOT part of `ContactSchema`, so\n * the caller manages its own state + validation and reads the\n * value back inside `onCustomSubmit`. */\n extraTopField?: ReactNode;\n\n title?: string;\n subtitle?: string;\n footerText?: string;\n noBorder?: boolean;\n noPadding?: boolean;\n buttonVariant?: ButtonProps['variant'];\n buttonClassName?: string;\n /** Submit-button label. Defaults to \"Send Message\". Override for\n * ticket surfaces (e.g. \"Open ticket\"). */\n submitLabel?: string;\n /** Success-state submit-button label (shown briefly after submit on\n * the built-in flow). Defaults to \"Message Sent!\". Has no effect\n * when `onCustomSubmit` is provided — the caller owns success UX. */\n submitSuccessLabel?: string;\n successRedirectUrl?: string;\n successToastMessage?: string;\n /** Form rescue (a half-filled form is saved so the team can follow up): the\n * form's definition (`RESCUE_FORMS.contact`, or the host's own\n * `defineRescueForm`). OPT-IN: omitted or `null` saves nothing, so a host that\n * has not chosen rescue never starts storing what visitors type. */\n rescue?: FormRescueDefinition | null;\n}\n\nexport function ContactForm({\n userId,\n helpCategoryOptions = defaultHelpCategoryOptions,\n rdtCid,\n onSubmitSuccess,\n prefilledReason,\n prefilledMessage,\n hideFields = [],\n defaultValues: defaultValuesProp,\n onCustomSubmit,\n extraTopField,\n attachmentsEnabled = false,\n title = 'Hit Us Up',\n subtitle,\n footerText = 'We typically respond within 24 hours. We respect your privacy – no spam, ever.',\n noBorder = false,\n noPadding = false,\n buttonVariant = 'accent',\n buttonClassName = '',\n submitLabel = 'Send Message',\n submitSuccessLabel = 'Message Sent!',\n successRedirectUrl = '/blog#community',\n successToastMessage = 'Redirecting you to join our community...',\n rescue: rescueForm = null,\n}: ContactFormProps = {}) {\n // Attachments staging — same hook the chat composer + ticket\n // detail-drawer composer use. Files upload to Supabase as soon as\n // the user picks them; `readyAttachments` is the wire-shape array\n // ready for the next submit. `hasInflightUploads` disables Send\n // until every upload settles.\n const attachments = useChatAttachments();\n // Built-in contact-API flow. Hook is called unconditionally (rules\n // of hooks); we just don't dispatch its `submit` when the caller\n // passes `onCustomSubmit`. The hook owns its own toast + redirect\n // chain so bypassing it cleanly hands all side-effects to the caller.\n const builtInSubmission = useContactSubmission({\n userId,\n successRedirectUrl,\n successToastMessage,\n });\n // Independent in-flight tracker for the custom path — we can't reuse\n // `builtInSubmission.isSubmitting` because that hook never sees a\n // request when `onCustomSubmit` is active.\n const [customSubmitting, setCustomSubmitting] = useState(false);\n\n // Invisible bot-protection signals (honeypot + timing). Spread into the\n // submit payload for BOTH the built-in and custom paths; reset on success.\n const { honeypotInputProps, getSignals, resetSignals } = useHumanitySignals();\n\n const isSubmitting = onCustomSubmit ? customSubmitting : builtInSubmission.isSubmitting;\n // `isSuccess` only ever fires on the built-in path; custom callers\n // own their own UX (no \"Message Sent!\" button-label flicker).\n const isSuccess = onCustomSubmit ? false : builtInSubmission.isSuccess;\n\n const form = useForm<ContactFormData>({\n resolver: zodResolver(ContactSchema),\n defaultValues: {\n ...(prefilledReason && { helpCategory: prefilledReason }),\n ...(prefilledMessage && { message: prefilledMessage }),\n // Caller-supplied defaults win over the legacy `prefilled*` props\n // (they're the authoritative seed for hidden fields).\n ...defaultValuesProp,\n },\n });\n const {\n register,\n handleSubmit,\n control,\n formState: { errors },\n reset,\n } = form;\n\n // Form rescue: only the fields the visitor can see are tracked, so a hidden\n // prefilled value (a signed-in email, a fixed category) is never sent.\n const rescueFieldNames = useMemo(\n () =>\n (['name', 'email', 'companySize', 'referralSource', 'helpCategory', 'message'] as const).filter(\n field => !hideFields.includes(field),\n ),\n [hideFields],\n );\n const rescue = useRescuedForm(form, { rescue: rescueForm, fields: rescueFieldNames, getSignals });\n\n const handleFormSubmit = async (data: ContactFormData) => {\n if (isSubmitting) return;\n if (attachmentsEnabled && attachments.hasInflightUploads) return;\n try {\n const payload = { ...data, ...(rdtCid && { rdt_cid: rdtCid }), ...getSignals(), ...rescue.submitFields() };\n const readyAttachments = attachmentsEnabled ? attachments.readyAttachments : [];\n if (onCustomSubmit) {\n setCustomSubmitting(true);\n try {\n await onCustomSubmit(payload, readyAttachments);\n } finally {\n setCustomSubmitting(false);\n }\n } else {\n await builtInSubmission.submit(payload);\n }\n rescue.complete();\n onSubmitSuccess?.();\n reset();\n resetSignals();\n if (attachmentsEnabled) attachments.clear();\n } catch {\n // Error toast is owned by the active flow:\n // - built-in: `useContactSubmission` toasts inside `submit()`.\n // - custom: the caller toasts inside `onCustomSubmit`.\n // Either way we swallow here so a thrown error doesn't crash the\n // form tree (react-hook-form's onSubmit handler rejects upward).\n }\n };\n\n const showName = !hideFields.includes('name');\n const showEmail = !hideFields.includes('email');\n const showNameEmailRow = showName || showEmail;\n const showCompanySize = !hideFields.includes('companySize');\n const showReferralSource = !hideFields.includes('referralSource');\n const showHelpCategory = !hideFields.includes('helpCategory');\n const showMessage = !hideFields.includes('message');\n\n return (\n <div\n className={`flex h-full flex-col ${!noBorder ? 'rounded-2xl border border-ods-border md:rounded-3xl' : ''} ${!noPadding ? 'p-6 md:p-8 lg:p-10' : ''}`}\n >\n {(title || subtitle) && (\n <div className=\"mb-6 md:mb-8\">\n {title && <h2 className={`${SECTION_HEADING_CLASS} mb-3 md:mb-4`}>{title}</h2>}\n {subtitle && <p className=\"text-ods-text-primary text-h4\">{subtitle}</p>}\n </div>\n )}\n\n <form\n onSubmit={handleSubmit(handleFormSubmit, validationErrors => {\n // When validation fails on a HIDDEN field (e.g. ticket form\n // hides name/email/helpCategory and seeds them via\n // `defaultValues`), there's no visible error UI for the user\n // — the submit button just appears dead. Log so the broken\n // defaultValues wiring is at least discoverable in DevTools.\n console.warn(\n '[ContactForm] submit blocked by validation:',\n Object.fromEntries(Object.entries(validationErrors).map(([k, v]) => [k, v?.message ?? v])),\n );\n })}\n className=\"flex flex-grow flex-col space-y-4 md:space-y-6\"\n {...HUBSPOT_DO_NOT_COLLECT_FORM_PROPS}\n >\n {/* Hidden inputs for fields that are required by `ContactSchema`\n but suppressed from the visible UI via `hideFields`. Without\n these, `register('name')` never runs, react-hook-form skips\n the field at submit time, and Zod's required-string check\n fails silently — the user clicks Submit and NOTHING visible\n happens (no error, no network call). The caller-supplied\n `defaultValues` seed the values; the hidden inputs just tell\n RHF to include them in the submit payload. */}\n {!showName && <input type=\"hidden\" {...register('name')} />}\n {!showEmail && <input type=\"hidden\" {...register('email')} />}\n {!showHelpCategory && <input type=\"hidden\" {...register('helpCategory')} />}\n {!showMessage && <input type=\"hidden\" {...register('message')} />}\n\n {/* Invisible honeypot — real users never fill it; bots that fill every field trip it. */}\n <HoneypotField {...honeypotInputProps} />\n\n {/* Extra top field (e.g. Subject for ticket forms). Rendered\n outside the schema-driven layout so the caller fully owns\n label / placeholder / state. */}\n {extraTopField}\n\n {showNameEmailRow && (\n <div className=\"grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6\">\n {showName && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"name\">\n Your Name\n <RequiredMark />\n </Label>\n <Input\n id=\"name\"\n type=\"text\"\n {...register('name')}\n placeholder=\"Jane Doe\"\n aria-invalid={!!errors.name}\n aria-required\n aria-describedby=\"name-error\"\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary placeholder-ods-text-secondary\"\n />\n {errors.name && (\n <span id=\"name-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.name.message}\n </span>\n )}\n </div>\n )}\n {showEmail && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"email\">\n Email\n <RequiredMark />\n </Label>\n <Input\n id=\"email\"\n type=\"email\"\n {...register('email')}\n placeholder=\"jane@company.com\"\n aria-invalid={!!errors.email}\n aria-required\n aria-describedby=\"email-error\"\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary placeholder-ods-text-secondary\"\n />\n {errors.email && (\n <span id=\"email-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.email.message}\n </span>\n )}\n </div>\n )}\n </div>\n )}\n\n {(showCompanySize || showReferralSource) && (\n <div className=\"grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6\">\n {showCompanySize && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"companySize\">Company Size</Label>\n <Controller\n control={control}\n name=\"companySize\"\n render={({ field }) => (\n <Select onValueChange={field.onChange} value={field.value ?? ''}>\n <SelectTrigger\n id=\"companySize\"\n aria-label=\"Company Size\"\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary\"\n >\n <SelectValue placeholder=\"Select company size\" />\n </SelectTrigger>\n <SelectContent>\n {companySizeOptions.map(opt => (\n <SelectItem key={opt} value={opt}>\n {opt}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n )}\n />\n {errors.companySize && (\n <span id=\"companySize-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.companySize.message}\n </span>\n )}\n </div>\n )}\n {showReferralSource && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"referralSource\">How did you hear about us?</Label>\n <Controller\n control={control}\n name=\"referralSource\"\n render={({ field }) => (\n <Select onValueChange={field.onChange} value={field.value ?? ''}>\n <SelectTrigger\n id=\"referralSource\"\n aria-label=\"Referral Source\"\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary\"\n >\n <SelectValue placeholder=\"Select an option\" />\n </SelectTrigger>\n <SelectContent>\n {referralSourceOptions.map(opt => (\n <SelectItem key={opt} value={opt}>\n {opt}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n )}\n />\n {errors.referralSource && (\n <span id=\"referralSource-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.referralSource.message}\n </span>\n )}\n </div>\n )}\n </div>\n )}\n\n {showHelpCategory && (\n <div className=\"flex flex-col\">\n <Label htmlFor=\"helpCategory\">\n Choose your main interest\n <RequiredMark />\n </Label>\n <Controller\n control={control}\n name=\"helpCategory\"\n render={({ field }) => (\n <Select onValueChange={field.onChange} value={field.value ?? ''}>\n <SelectTrigger\n id=\"helpCategory\"\n aria-label=\"Help Category\"\n aria-required\n className=\"h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary\"\n >\n <SelectValue placeholder=\"Choose your main interest\" />\n </SelectTrigger>\n <SelectContent>\n {helpCategoryOptions.map(opt => (\n <SelectItem key={opt} value={opt}>\n {opt}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n )}\n />\n {errors.helpCategory && (\n <span id=\"helpCategory-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.helpCategory.message}\n </span>\n )}\n </div>\n )}\n\n {showMessage && (\n <div className=\"flex flex-grow flex-col\">\n <Label htmlFor=\"message\">\n Your Message\n <RequiredMark />\n </Label>\n <Textarea\n id=\"message\"\n {...register('message')}\n placeholder=\"Share your current challenges or questions about open-source alternatives...\"\n aria-invalid={!!errors.message}\n aria-required\n aria-describedby=\"message-error\"\n className=\"h-full flex-grow border-ods-border bg-ods-card text-ods-text-primary placeholder-ods-text-secondary\"\n />\n {errors.message && (\n <span id=\"message-error\" className=\"mt-1 text-ods-error text-h6\">\n {errors.message.message}\n </span>\n )}\n </div>\n )}\n\n {/* Attachments — only renders when `attachmentsEnabled` is on.\n Uses the SAME chip strip + add button + staging hook the\n chat composer and ticket-drawer composer use, so the visual\n chip styling + upload-progress UX are identical everywhere\n attachments appear. */}\n {attachmentsEnabled && (\n <div className=\"flex flex-col gap-2\">\n <ChatAttachmentChipStrip\n attachments={attachments.attachments}\n onRemove={attachments.removeAttachment}\n disabled={isSubmitting}\n />\n <div className=\"flex items-center gap-2\">\n <ChatAttachmentAddButton\n attachmentsEnabled\n attachmentsCount={attachments.attachments.length}\n onAddFiles={attachments.addFiles}\n disabled={isSubmitting}\n />\n <span className=\"text-ods-text-secondary text-h6\">Attach files (optional)</span>\n </div>\n </div>\n )}\n\n <div className=\"mt-auto flex w-full flex-col items-center justify-end gap-4 pt-2 md:flex-row md:gap-6\">\n {footerText && <p className=\"text-center text-ods-text-secondary text-h6 md:text-left\">{footerText}</p>}\n <Button\n type=\"submit\"\n loading={isSubmitting}\n disabled={isSubmitting || isSuccess || (attachmentsEnabled && attachments.hasInflightUploads)}\n variant={buttonVariant}\n className={`w-full md:w-auto ${buttonClassName}`}\n >\n {isSuccess ? submitSuccessLabel : submitLabel}\n </Button>\n </div>\n </form>\n </div>\n );\n}\n","import { z } from 'zod';\n\n// Dropdown option constants — re-exported by `<ContactForm>` consumers\n// that want to surface their own custom Select widgets keyed on the\n// same allowed-value set.\nexport const companySizeOptions = ['1-10', '11-50', '51-200', '201-500', '501-1000', '1001+'] as const;\n\nexport const referralSourceOptions = [\n 'Google',\n 'LinkedIn',\n 'Twitter/X',\n 'Reddit',\n 'Friend / Colleague',\n 'Other',\n] as const;\n\n// Default fallback options — used when the embedder doesn't supply\n// platform-specific help-category options via the `helpCategoryOptions`\n// prop on `<ContactForm>`.\nexport const defaultHelpCategoryOptions = [\n 'Open-Source Alternatives',\n 'Vendor Cost Reduction',\n 'MSP Best Practices',\n 'Partnerships',\n 'Press',\n 'Other',\n] as const;\n\n// Reusable LinkedIn URL validator — the single source of truth. Every\n// public form schema, every admin update schema, every HubSpot push\n// validator MUST reference this so validation rules cannot drift\n// across boundaries.\n//\n// Host validation parses the URL and checks the hostname suffix so an\n// adversarial input like `https://evil.com/linkedin.com/x` is rejected\n// (substring match would have accepted it — CodeQL alert\n// \"Incomplete URL substring sanitization\").\nexport const LinkedInUrlSchema = z\n .string()\n .url({ message: 'Please enter a valid LinkedIn URL' })\n .refine(\n url => {\n try {\n const host = new URL(url).hostname.toLowerCase();\n return host === 'linkedin.com' || host.endsWith('.linkedin.com');\n } catch {\n return false;\n }\n },\n {\n message: 'Please enter a valid LinkedIn profile URL',\n },\n )\n .optional()\n .or(z.literal(''));\n\n/**\n * Base schema — fields shared by every contact-style form (main contact\n * form, TMCG join, data-room request, case-study pitch, etc.). Any\n * field that exists on a form but NOT on this schema is silently\n * stripped by `safeParse` — that's exactly the bug the LinkedIn field\n * hit historically.\n */\nexport const ContactBaseSchema = z.object({\n name: z.string().min(2, { message: 'Name must be at least 2 characters' }).max(255, { message: 'Name is too long' }),\n email: z.string().email({ message: 'Please enter a valid email address' }).max(255),\n linkedin_url: LinkedInUrlSchema,\n helpCategory: z\n .string()\n .min(1, { message: 'Please select what we can help you with' })\n .max(255, { message: 'Help category is too long' }),\n message: z\n .string()\n .min(10, { message: 'Message must be at least 10 characters' })\n .max(5000, { message: 'Message is too long (5,000 character limit)' }),\n rdt_cid: z.string().optional(),\n});\n\n// Public POST /api/contact validator — base + dropdown fields used by\n// the generic contact form. Other form-specific schemas extend\n// `ContactBaseSchema`.\nexport const ContactSchema = ContactBaseSchema.extend({\n companySize: z\n .string()\n .optional()\n .refine(val => !val || companySizeOptions.includes(val as (typeof companySizeOptions)[number]), {\n message: 'Please select a valid company size',\n }),\n referralSource: z\n .string()\n .optional()\n .refine(val => !val || referralSourceOptions.includes(val as (typeof referralSourceOptions)[number]), {\n message: 'Please select a valid referral source',\n }),\n});\n\nexport type ContactFormData = z.infer<typeof ContactSchema>;\n\nexport interface ContactApiResponse {\n success: boolean;\n error?: string;\n}\n"]}
|