@flamingo-stack/openframe-frontend-core 0.0.588 → 0.0.589-1973.5571.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/chat-protocol/events.d.ts +8 -2
- package/dist/chat-protocol/events.d.ts.map +1 -1
- package/dist/chat-protocol/index.cjs +188 -0
- package/dist/chat-protocol/index.cjs.map +1 -1
- package/dist/chat-protocol/index.js +188 -0
- package/dist/chat-protocol/index.js.map +1 -1
- package/dist/chat-protocol/nats-decoder.d.ts.map +1 -1
- package/dist/chat-protocol/source-metadata.d.ts +5 -0
- package/dist/chat-protocol/source-metadata.d.ts.map +1 -0
- package/dist/{chunk-GKPY7VLK.js → chunk-47NIV4FC.js} +4 -4
- package/dist/{chunk-D7YISHXC.js → chunk-4MVGFYRE.js} +534 -190
- package/dist/chunk-4MVGFYRE.js.map +1 -0
- package/dist/{chunk-I5CJJFEJ.js → chunk-4VDGIODG.js} +3 -3
- package/dist/{chunk-PAUJQV3C.cjs → chunk-627JVTID.cjs} +15 -15
- package/dist/{chunk-PAUJQV3C.cjs.map → chunk-627JVTID.cjs.map} +1 -1
- package/dist/{chunk-3OCYNMZ5.js → chunk-CQNILR7U.js} +3 -3
- package/dist/{chunk-BONXSRHZ.cjs → chunk-DPQGO4PH.cjs} +21 -21
- package/dist/{chunk-BONXSRHZ.cjs.map → chunk-DPQGO4PH.cjs.map} +1 -1
- package/dist/{chunk-A6X7EXP6.cjs → chunk-DVAAXDZV.cjs} +10 -10
- package/dist/{chunk-A6X7EXP6.cjs.map → chunk-DVAAXDZV.cjs.map} +1 -1
- package/dist/{chunk-CN36E4PK.js → chunk-EJEHIAOV.js} +2 -2
- package/dist/{chunk-G45RGWHF.cjs → chunk-EKKR5ZFB.cjs} +887 -543
- package/dist/chunk-EKKR5ZFB.cjs.map +1 -0
- package/dist/{chunk-IYDHV2CS.cjs → chunk-FIEOWSXH.cjs} +43 -43
- package/dist/{chunk-IYDHV2CS.cjs.map → chunk-FIEOWSXH.cjs.map} +1 -1
- package/dist/{chunk-CJOWLRUU.js → chunk-G4ND6ZZK.js} +2 -2
- package/dist/{chunk-KWTV3KGY.cjs → chunk-GDHQTVBP.cjs} +9 -9
- package/dist/{chunk-KWTV3KGY.cjs.map → chunk-GDHQTVBP.cjs.map} +1 -1
- package/dist/{chunk-ADANP3ZA.cjs → chunk-GOHHFX4O.cjs} +33 -33
- package/dist/{chunk-ADANP3ZA.cjs.map → chunk-GOHHFX4O.cjs.map} +1 -1
- package/dist/{chunk-KVNGYFFP.js → chunk-GU5TWGAJ.js} +3 -3
- package/dist/{chunk-EGYX55HT.cjs → chunk-HQKWJFFX.cjs} +159 -159
- package/dist/{chunk-EGYX55HT.cjs.map → chunk-HQKWJFFX.cjs.map} +1 -1
- package/dist/{chunk-NXZC6UTN.js → chunk-HZ6VUTLA.js} +2 -2
- package/dist/{chunk-WUCYI3BC.cjs → chunk-KH5KDKCE.cjs} +24 -24
- package/dist/{chunk-WUCYI3BC.cjs.map → chunk-KH5KDKCE.cjs.map} +1 -1
- package/dist/{chunk-JDINUWND.cjs → chunk-MQFA5DXU.cjs} +69 -69
- package/dist/{chunk-JDINUWND.cjs.map → chunk-MQFA5DXU.cjs.map} +1 -1
- package/dist/{chunk-5CHW7AMP.cjs → chunk-NHW2AM2X.cjs} +10 -10
- package/dist/{chunk-5CHW7AMP.cjs.map → chunk-NHW2AM2X.cjs.map} +1 -1
- package/dist/{chunk-KK3XU6YJ.cjs → chunk-NIHPN72N.cjs} +4 -4
- package/dist/{chunk-KK3XU6YJ.cjs.map → chunk-NIHPN72N.cjs.map} +1 -1
- package/dist/{chunk-EGUU3QCU.cjs → chunk-NNRRRWCD.cjs} +3 -3
- package/dist/{chunk-EGUU3QCU.cjs.map → chunk-NNRRRWCD.cjs.map} +1 -1
- package/dist/{chunk-4ZKAMPBX.js → chunk-OAY342OE.js} +2 -2
- package/dist/{chunk-TOYHZHTK.js → chunk-PDFH7CXB.js} +2 -2
- package/dist/{chunk-NIDPX52C.js → chunk-QIHBS5PM.js} +5 -5
- package/dist/{chunk-CNKVEVUN.js → chunk-SPOIDC23.js} +5 -5
- package/dist/{chunk-MENQLD57.cjs → chunk-T5FJOWHA.cjs} +5 -5
- package/dist/{chunk-MENQLD57.cjs.map → chunk-T5FJOWHA.cjs.map} +1 -1
- package/dist/{chunk-5FNWOF46.js → chunk-WZZSFOWG.js} +6 -6
- package/dist/{chunk-FVRRYJ6P.cjs → chunk-XIKSZSHC.cjs} +22 -22
- package/dist/{chunk-FVRRYJ6P.cjs.map → chunk-XIKSZSHC.cjs.map} +1 -1
- package/dist/{chunk-C6RJRSIM.cjs → chunk-XTMNO7MC.cjs} +3 -3
- package/dist/{chunk-C6RJRSIM.cjs.map → chunk-XTMNO7MC.cjs.map} +1 -1
- package/dist/{chunk-FQBR6SCA.js → chunk-XW4GOMK6.js} +3 -3
- package/dist/{chunk-77Y7R243.js → chunk-YEEMXD25.js} +5 -5
- package/dist/{chunk-LGBNHWDN.js → chunk-YTVTZ7JO.js} +3 -3
- package/dist/components/case-studies/index.cjs +9 -9
- package/dist/components/case-studies/index.js +3 -3
- 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/embeddable-chat.d.ts.map +1 -1
- package/dist/components/chat/entity-cards/dispatch.d.ts.map +1 -1
- package/dist/components/chat/hooks/use-nats-chat-adapter.d.ts +4 -1
- package/dist/components/chat/hooks/use-nats-chat-adapter.d.ts.map +1 -1
- package/dist/components/chat/hooks/use-slash-commands.d.ts +3 -3
- package/dist/components/chat/hooks/use-slash-commands.d.ts.map +1 -1
- package/dist/components/chat/hooks/use-sse-chat-adapter.d.ts +2 -28
- package/dist/components/chat/hooks/use-sse-chat-adapter.d.ts.map +1 -1
- package/dist/components/chat/index.cjs +2 -2
- package/dist/components/chat/index.js +1 -1
- package/dist/components/chat/remark-strip-citations.d.ts.map +1 -1
- package/dist/components/chat/stream/chat-stream-reducer.d.ts.map +1 -1
- package/dist/components/chat/tool-execution-display.d.ts.map +1 -1
- package/dist/components/chat/types/component.types.d.ts +4 -0
- package/dist/components/chat/types/component.types.d.ts.map +1 -1
- package/dist/components/chat/types/message.types.d.ts +35 -1
- package/dist/components/chat/types/message.types.d.ts.map +1 -1
- package/dist/components/chat/types/unified-chat-state.types.d.ts +3 -3
- package/dist/components/chat/types/unified-chat-state.types.d.ts.map +1 -1
- package/dist/components/chat/utils/chat-source-metadata.d.ts +5 -0
- package/dist/components/chat/utils/chat-source-metadata.d.ts.map +1 -0
- package/dist/components/chat/utils/process-historical-messages.d.ts.map +1 -1
- package/dist/components/contact/index.cjs +4 -4
- package/dist/components/contact/index.js +3 -3
- package/dist/components/docs/index.cjs +7 -7
- package/dist/components/docs/index.js +6 -6
- package/dist/components/embeds/index.cjs +4 -4
- package/dist/components/embeds/index.js +3 -3
- package/dist/components/faq/index.cjs +4 -4
- package/dist/components/faq/index.js +3 -3
- package/dist/components/features/index.cjs +3 -3
- package/dist/components/features/index.js +2 -2
- package/dist/components/help-center-pages/index.cjs +23 -23
- package/dist/components/help-center-pages/index.js +14 -14
- package/dist/components/index.cjs +36 -36
- package/dist/components/index.js +13 -13
- package/dist/components/meeting-scheduler/index.cjs +21 -21
- package/dist/components/meeting-scheduler/index.js +2 -2
- package/dist/components/navigation/index.cjs +6 -6
- package/dist/components/navigation/index.js +5 -5
- package/dist/components/onboarding-guides/index.cjs +6 -6
- package/dist/components/onboarding-guides/index.js +5 -5
- package/dist/components/tickets/index.cjs +7 -7
- package/dist/components/tickets/index.js +6 -6
- package/dist/components/ui/hover-dropdown.d.ts.map +1 -1
- package/dist/components/ui/index.cjs +3 -3
- package/dist/components/ui/index.js +2 -2
- package/dist/index.cjs +7 -7
- package/dist/index.js +6 -6
- package/dist/utils/index.cjs.map +1 -1
- package/dist/utils/index.js.map +1 -1
- package/package.json +2 -1
- package/src/chat-protocol/__tests__/nats-decoder-golden.test.ts +130 -0
- package/src/chat-protocol/__tests__/source-metadata.test.ts +74 -0
- package/src/chat-protocol/events.ts +9 -1
- package/src/chat-protocol/nats-decoder.ts +7 -0
- package/src/chat-protocol/source-metadata.ts +202 -0
- package/src/components/chat/__tests__/chat-message-list.test.tsx +70 -0
- package/src/components/chat/__tests__/chat-message-streaming-memo.test.tsx +86 -0
- package/src/components/chat/__tests__/embeddable-chat-sources.test.tsx +411 -0
- package/src/components/chat/__tests__/remark-strip-citations.test.ts +52 -0
- package/src/components/chat/__tests__/tool-execution-display.test.tsx +93 -0
- package/src/components/chat/chat-message-enhanced.tsx +28 -13
- package/src/components/chat/chat-message-list.tsx +27 -22
- package/src/components/chat/embeddable-chat.tsx +55 -36
- package/src/components/chat/entity-cards/__tests__/dispatch-video-refs.test.tsx +74 -0
- package/src/components/chat/entity-cards/dispatch.tsx +86 -17
- package/src/components/chat/hooks/__tests__/use-slash-commands.test.ts +64 -0
- package/src/components/chat/hooks/use-nats-chat-adapter.ts +7 -0
- package/src/components/chat/hooks/use-slash-commands.ts +9 -5
- package/src/components/chat/hooks/use-sse-chat-adapter.ts +2 -29
- package/src/components/chat/remark-strip-citations.ts +5 -3
- package/src/components/chat/stream/__tests__/chat-stream-reducer.test.ts +56 -0
- package/src/components/chat/stream/chat-stream-reducer.ts +31 -0
- package/src/components/chat/tool-execution-display.tsx +5 -2
- package/src/components/chat/types/component.types.ts +4 -0
- package/src/components/chat/types/message.types.ts +39 -0
- package/src/components/chat/types/unified-chat-state.types.ts +4 -3
- package/src/components/chat/utils/__tests__/process-historical-messages-golden.test.ts +57 -0
- package/src/components/chat/utils/chat-source-metadata.ts +19 -0
- package/src/components/chat/utils/process-historical-messages.ts +19 -1
- package/src/components/ui/hover-dropdown.tsx +8 -3
- package/dist/chunk-D7YISHXC.js.map +0 -1
- package/dist/chunk-G45RGWHF.cjs.map +0 -1
- /package/dist/{chunk-GKPY7VLK.js.map → chunk-47NIV4FC.js.map} +0 -0
- /package/dist/{chunk-I5CJJFEJ.js.map → chunk-4VDGIODG.js.map} +0 -0
- /package/dist/{chunk-3OCYNMZ5.js.map → chunk-CQNILR7U.js.map} +0 -0
- /package/dist/{chunk-CN36E4PK.js.map → chunk-EJEHIAOV.js.map} +0 -0
- /package/dist/{chunk-CJOWLRUU.js.map → chunk-G4ND6ZZK.js.map} +0 -0
- /package/dist/{chunk-KVNGYFFP.js.map → chunk-GU5TWGAJ.js.map} +0 -0
- /package/dist/{chunk-NXZC6UTN.js.map → chunk-HZ6VUTLA.js.map} +0 -0
- /package/dist/{chunk-4ZKAMPBX.js.map → chunk-OAY342OE.js.map} +0 -0
- /package/dist/{chunk-TOYHZHTK.js.map → chunk-PDFH7CXB.js.map} +0 -0
- /package/dist/{chunk-NIDPX52C.js.map → chunk-QIHBS5PM.js.map} +0 -0
- /package/dist/{chunk-CNKVEVUN.js.map → chunk-SPOIDC23.js.map} +0 -0
- /package/dist/{chunk-5FNWOF46.js.map → chunk-WZZSFOWG.js.map} +0 -0
- /package/dist/{chunk-FQBR6SCA.js.map → chunk-XW4GOMK6.js.map} +0 -0
- /package/dist/{chunk-77Y7R243.js.map → chunk-YEEMXD25.js.map} +0 -0
- /package/dist/{chunk-LGBNHWDN.js.map → chunk-YTVTZ7JO.js.map} +0 -0
|
@@ -4,7 +4,7 @@ import {
|
|
|
4
4
|
getOSLabel,
|
|
5
5
|
getShellLabel,
|
|
6
6
|
getToolLabel
|
|
7
|
-
} from "./chunk-
|
|
7
|
+
} from "./chunk-OAY342OE.js";
|
|
8
8
|
import {
|
|
9
9
|
cn as cn2,
|
|
10
10
|
useOnboardingState
|
|
@@ -14,7 +14,7 @@ import {
|
|
|
14
14
|
} from "./chunk-MXOSTJAG.js";
|
|
15
15
|
import {
|
|
16
16
|
SECTION_HEADING_CLASS
|
|
17
|
-
} from "./chunk-
|
|
17
|
+
} from "./chunk-4MVGFYRE.js";
|
|
18
18
|
import {
|
|
19
19
|
ToolIcon
|
|
20
20
|
} from "./chunk-JRYS4VMV.js";
|
|
@@ -530,4 +530,4 @@ export {
|
|
|
530
530
|
OnboardingStepCard,
|
|
531
531
|
OnboardingWalkthrough
|
|
532
532
|
};
|
|
533
|
-
//# sourceMappingURL=chunk-
|
|
533
|
+
//# sourceMappingURL=chunk-4VDGIODG.js.map
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
var
|
|
7
|
+
var _chunkHQKWJFFXcjs = require('./chunk-HQKWJFFX.cjs');
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
|
|
@@ -14,7 +14,7 @@ var _chunkLEISUAHFcjs = require('./chunk-LEISUAHF.cjs');
|
|
|
14
14
|
var _chunkIKDC3R7Vcjs = require('./chunk-IKDC3R7V.cjs');
|
|
15
15
|
|
|
16
16
|
|
|
17
|
-
var
|
|
17
|
+
var _chunkEKKR5ZFBcjs = require('./chunk-EKKR5ZFB.cjs');
|
|
18
18
|
|
|
19
19
|
|
|
20
20
|
var _chunkZI27ALYXcjs = require('./chunk-ZI27ALYX.cjs');
|
|
@@ -122,7 +122,7 @@ CveLink.displayName = "CveLink";
|
|
|
122
122
|
// src/components/platform/ToolBadge.tsx
|
|
123
123
|
|
|
124
124
|
var ToolBadge = ({ toolType, className, iconClassName }) => {
|
|
125
|
-
const label =
|
|
125
|
+
const label = _chunkHQKWJFFXcjs.getToolLabel.call(void 0, toolType);
|
|
126
126
|
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkPRPZBXWZcjs.cn.call(void 0, "flex items-center gap-1 text-ods-text-secondary", className), children: [
|
|
127
127
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZI27ALYXcjs.ToolIcon, { toolType, className: iconClassName, size: 16 }),
|
|
128
128
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-ods-text-primary text-h4", children: label })
|
|
@@ -133,31 +133,31 @@ ToolBadge.displayName = "ToolBadge";
|
|
|
133
133
|
// src/components/platform/ShellTypeBadge.tsx
|
|
134
134
|
|
|
135
135
|
var shellIconMap = {
|
|
136
|
-
[
|
|
136
|
+
[_chunkHQKWJFFXcjs.ShellTypeValues.POWERSHELL]: {
|
|
137
137
|
icon: _chunkGSQM4PDRcjs.PowershellLogoGreyIcon,
|
|
138
138
|
props: { size: 16, className: "text-ods-text-secondary" }
|
|
139
139
|
},
|
|
140
|
-
[
|
|
140
|
+
[_chunkHQKWJFFXcjs.ShellTypeValues.CMD]: {
|
|
141
141
|
icon: _chunkKZAAIUP5cjs.CmdIcon,
|
|
142
142
|
props: { size: 16, color: "var(--color-text-secondary)" }
|
|
143
143
|
},
|
|
144
|
-
[
|
|
144
|
+
[_chunkHQKWJFFXcjs.ShellTypeValues.BASH]: {
|
|
145
145
|
icon: _chunkKZAAIUP5cjs.BashIcon,
|
|
146
146
|
props: { size: 16, color: "var(--color-text-secondary)" }
|
|
147
147
|
},
|
|
148
|
-
[
|
|
148
|
+
[_chunkHQKWJFFXcjs.ShellTypeValues.PYTHON]: {
|
|
149
149
|
icon: _chunkGSQM4PDRcjs.PythonLogoIcon,
|
|
150
150
|
props: { size: 16, className: "text-ods-text-secondary" }
|
|
151
151
|
},
|
|
152
|
-
[
|
|
152
|
+
[_chunkHQKWJFFXcjs.ShellTypeValues.NUSHELL]: {
|
|
153
153
|
icon: _chunkKZAAIUP5cjs.NushellIcon,
|
|
154
154
|
props: { size: 16, color: "var(--color-text-secondary)" }
|
|
155
155
|
},
|
|
156
|
-
[
|
|
156
|
+
[_chunkHQKWJFFXcjs.ShellTypeValues.DENO]: {
|
|
157
157
|
icon: _chunkKZAAIUP5cjs.DenoIcon,
|
|
158
158
|
props: { size: 16, color: "var(--color-text-secondary)" }
|
|
159
159
|
},
|
|
160
|
-
[
|
|
160
|
+
[_chunkHQKWJFFXcjs.ShellTypeValues.SHELL]: {
|
|
161
161
|
icon: _chunkKZAAIUP5cjs.ShellIcon,
|
|
162
162
|
props: { size: 16, color: "var(--color-text-secondary)" }
|
|
163
163
|
}
|
|
@@ -168,7 +168,7 @@ var defaultIconConfig = {
|
|
|
168
168
|
};
|
|
169
169
|
var ShellTypeBadge = ({ shellType, className, iconClassName }) => {
|
|
170
170
|
const normalizedType = _optionalChain([shellType, 'optionalAccess', _ => _.toUpperCase, 'call', _2 => _2()]);
|
|
171
|
-
const label =
|
|
171
|
+
const label = _chunkHQKWJFFXcjs.getShellLabel.call(void 0, normalizedType);
|
|
172
172
|
const { icon: IconComponent, props: iconProps } = _nullishCoalesce(shellIconMap[normalizedType], () => ( defaultIconConfig));
|
|
173
173
|
const defaultIconClassName = "className" in iconProps ? iconProps.className : void 0;
|
|
174
174
|
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkPRPZBXWZcjs.cn.call(void 0, "flex items-center gap-1", className), children: [
|
|
@@ -184,7 +184,7 @@ function formatSupportedPlatforms(platforms) {
|
|
|
184
184
|
if (!platforms || platforms.length === 0) {
|
|
185
185
|
return "All Platforms";
|
|
186
186
|
}
|
|
187
|
-
return platforms.map((platform) =>
|
|
187
|
+
return platforms.map((platform) => _chunkHQKWJFFXcjs.getOSLabel.call(void 0, platform)).join(", ");
|
|
188
188
|
}
|
|
189
189
|
function getInitials(name) {
|
|
190
190
|
const parts = name.trim().split(/\s+/);
|
|
@@ -211,7 +211,7 @@ var ScriptInfoSection = ({
|
|
|
211
211
|
author,
|
|
212
212
|
className
|
|
213
213
|
}) => {
|
|
214
|
-
const shellLabel =
|
|
214
|
+
const shellLabel = _chunkHQKWJFFXcjs.getShellLabel.call(void 0, shellType);
|
|
215
215
|
const platformsLabel = formatSupportedPlatforms(supportedPlatforms);
|
|
216
216
|
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkPRPZBXWZcjs.cn.call(void 0, "overflow-hidden rounded-[6px] border border-ods-border bg-ods-card", className), children: [
|
|
217
217
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "border-b border-ods-border p-4", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-1", children: [
|
|
@@ -501,7 +501,7 @@ function OnboardingWalkthrough({
|
|
|
501
501
|
const isAllComplete = allStepsComplete(steps);
|
|
502
502
|
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkPRPZBXWZcjs.cn.call(void 0, "w-full space-y-4", className), children: [
|
|
503
503
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-start justify-between gap-3 md:flex-row md:items-center md:gap-0", children: [
|
|
504
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className:
|
|
504
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: _chunkEKKR5ZFBcjs.SECTION_HEADING_CLASS, children: "Get Started" }),
|
|
505
505
|
isLoadingCompletion ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[48px] w-full animate-pulse rounded-[6px] bg-ods-border md:w-[160px]" }) : isAllComplete ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYHNIPSG6cjs.Button, { variant: "accent", onClick: handleDismiss, className: "w-full md:w-auto", children: "Close Onboarding" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYHNIPSG6cjs.Button, { variant: "outline", onClick: handleDismiss, className: "w-full md:w-auto", children: "Skip Onboarding" })
|
|
506
506
|
] }),
|
|
507
507
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunkPRPZBXWZcjs.cn.call(void 0, spacing), children: steps.map((step) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
@@ -530,4 +530,4 @@ function OnboardingWalkthrough({
|
|
|
530
530
|
|
|
531
531
|
|
|
532
532
|
exports.SoftwareInfo = SoftwareInfo; exports.SoftwareSourceBadge = SoftwareSourceBadge; exports.CveLink = CveLink; exports.ToolBadge = ToolBadge; exports.ShellTypeBadge = ShellTypeBadge; exports.ScriptInfoSection = ScriptInfoSection; exports.ScriptArguments = ScriptArguments; exports.OnboardingStepCard = OnboardingStepCard; exports.OnboardingWalkthrough = OnboardingWalkthrough;
|
|
533
|
-
//# sourceMappingURL=chunk-
|
|
533
|
+
//# sourceMappingURL=chunk-627JVTID.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-PAUJQV3C.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"],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-PAUJQV3C.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 { 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 * Gets initials from a name\n * @param name - Full name\n * @returns Two-letter initials\n */\nfunction getInitials(name: string): string {\n const parts = name.trim().split(/\\s+/);\n if (parts.length >= 2) {\n return `${parts[0][0]}${parts[1][0]}`.toUpperCase();\n }\n return name.slice(0, 2).toUpperCase();\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 || getInitials(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 { PlusCircleIcon } from '../icons-v2-generated';\nimport { Button } from '../ui/button';\nimport { Input } from '../ui/input';\nimport { Label } from '../ui/label';\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\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 /** 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 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 = () => {\n if (!onArgumentsChange) return;\n const newArg: ScriptArgument = {\n id: crypto.randomUUID(),\n key: '',\n value: '',\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 <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 />\n </div>\n\n {/* Value input with delete button */}\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 value={arg.value}\n onChange={e => handleValueChange(arg.id, e.target.value)}\n placeholder={valuePlaceholder}\n disabled={disabled}\n className={cn(!arg.value && 'placeholder:text-ods-text-muted')}\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 {/* Add button - aligned left */}\n <div className=\"flex justify-start\">\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 </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 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 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 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 const statusKey = JSON.stringify(completionStatus);\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 console.log('📊 Auto-marking steps as complete from hook data:', completedStepIds);\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 }, [completionStatus, isLoadingCompletion, state.completedSteps, markMultipleComplete]);\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 console.log(`⏳ Action already in progress for \"${step.id}\", skipping`);\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 console.log(`✓ Step \"${step.id}\" already completed, skipping mark`);\n return;\n }\n\n // Auto-mark Knowledge Base as complete (no verification needed)\n if (step.id === 'knowledge-base') {\n console.log(`🎯 Auto-completing 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 console.log(`🔍 Post-action check for \"${step.id}\": isComplete=${isComplete}`);\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 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}>Get Started</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-627JVTID.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"],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-627JVTID.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 { 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 * Gets initials from a name\n * @param name - Full name\n * @returns Two-letter initials\n */\nfunction getInitials(name: string): string {\n const parts = name.trim().split(/\\s+/);\n if (parts.length >= 2) {\n return `${parts[0][0]}${parts[1][0]}`.toUpperCase();\n }\n return name.slice(0, 2).toUpperCase();\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 || getInitials(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 { PlusCircleIcon } from '../icons-v2-generated';\nimport { Button } from '../ui/button';\nimport { Input } from '../ui/input';\nimport { Label } from '../ui/label';\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\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 /** 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 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 = () => {\n if (!onArgumentsChange) return;\n const newArg: ScriptArgument = {\n id: crypto.randomUUID(),\n key: '',\n value: '',\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 <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 />\n </div>\n\n {/* Value input with delete button */}\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 value={arg.value}\n onChange={e => handleValueChange(arg.id, e.target.value)}\n placeholder={valuePlaceholder}\n disabled={disabled}\n className={cn(!arg.value && 'placeholder:text-ods-text-muted')}\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 {/* Add button - aligned left */}\n <div className=\"flex justify-start\">\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 </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 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 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 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 const statusKey = JSON.stringify(completionStatus);\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 console.log('📊 Auto-marking steps as complete from hook data:', completedStepIds);\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 }, [completionStatus, isLoadingCompletion, state.completedSteps, markMultipleComplete]);\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 console.log(`⏳ Action already in progress for \"${step.id}\", skipping`);\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 console.log(`✓ Step \"${step.id}\" already completed, skipping mark`);\n return;\n }\n\n // Auto-mark Knowledge Base as complete (no verification needed)\n if (step.id === 'knowledge-base') {\n console.log(`🎯 Auto-completing 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 console.log(`🔍 Post-action check for \"${step.id}\": isComplete=${isComplete}`);\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 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}>Get Started</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"]}
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
SelectTrigger,
|
|
8
8
|
SelectValue,
|
|
9
9
|
Textarea
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-OAY342OE.js";
|
|
11
11
|
import {
|
|
12
12
|
useContactSubmission,
|
|
13
13
|
useHumanitySignals
|
|
@@ -20,7 +20,7 @@ import {
|
|
|
20
20
|
ChatAttachmentChipStrip,
|
|
21
21
|
SECTION_HEADING_CLASS,
|
|
22
22
|
useChatAttachments
|
|
23
|
-
} from "./chunk-
|
|
23
|
+
} from "./chunk-4MVGFYRE.js";
|
|
24
24
|
import {
|
|
25
25
|
Label
|
|
26
26
|
} from "./chunk-U5M5DXYT.js";
|
|
@@ -369,4 +369,4 @@ function ContactForm({
|
|
|
369
369
|
export {
|
|
370
370
|
ContactForm
|
|
371
371
|
};
|
|
372
|
-
//# sourceMappingURL=chunk-
|
|
372
|
+
//# sourceMappingURL=chunk-CQNILR7U.js.map
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _chunkHQKWJFFXcjs = require('./chunk-HQKWJFFX.cjs');
|
|
11
11
|
|
|
12
12
|
|
|
13
13
|
|
|
@@ -20,7 +20,7 @@ var _chunkIKDC3R7Vcjs = require('./chunk-IKDC3R7V.cjs');
|
|
|
20
20
|
|
|
21
21
|
|
|
22
22
|
|
|
23
|
-
var
|
|
23
|
+
var _chunkEKKR5ZFBcjs = require('./chunk-EKKR5ZFB.cjs');
|
|
24
24
|
|
|
25
25
|
|
|
26
26
|
var _chunk3QDJLLD2cjs = require('./chunk-3QDJLLD2.cjs');
|
|
@@ -108,7 +108,7 @@ function ContactForm({
|
|
|
108
108
|
successRedirectUrl = "/blog#community",
|
|
109
109
|
successToastMessage = "Redirecting you to join our community..."
|
|
110
110
|
} = {}) {
|
|
111
|
-
const attachments =
|
|
111
|
+
const attachments = _chunkEKKR5ZFBcjs.useChatAttachments.call(void 0, );
|
|
112
112
|
const builtInSubmission = _chunkLEISUAHFcjs.useContactSubmission.call(void 0, {
|
|
113
113
|
userId,
|
|
114
114
|
successRedirectUrl,
|
|
@@ -170,7 +170,7 @@ function ContactForm({
|
|
|
170
170
|
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" : ""}`,
|
|
171
171
|
children: [
|
|
172
172
|
(title || subtitle) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mb-6 md:mb-8", children: [
|
|
173
|
-
title && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: `${
|
|
173
|
+
title && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: `${_chunkEKKR5ZFBcjs.SECTION_HEADING_CLASS} mb-3 md:mb-4`, children: title }),
|
|
174
174
|
subtitle && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-ods-text-primary text-h4", children: subtitle })
|
|
175
175
|
] }),
|
|
176
176
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
@@ -188,7 +188,7 @@ function ContactForm({
|
|
|
188
188
|
!showEmail && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", { type: "hidden", ...register("email") }),
|
|
189
189
|
!showHelpCategory && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", { type: "hidden", ...register("helpCategory") }),
|
|
190
190
|
!showMessage && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", { type: "hidden", ...register("message") }),
|
|
191
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
191
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.HoneypotField, { ...honeypotInputProps }),
|
|
192
192
|
extraTopField,
|
|
193
193
|
showNameEmailRow && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6", children: [
|
|
194
194
|
showName && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col", children: [
|
|
@@ -238,17 +238,17 @@ function ContactForm({
|
|
|
238
238
|
{
|
|
239
239
|
control,
|
|
240
240
|
name: "companySize",
|
|
241
|
-
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
241
|
+
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkHQKWJFFXcjs.Select, { onValueChange: field.onChange, defaultValue: field.value, children: [
|
|
242
242
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
243
|
-
|
|
243
|
+
_chunkHQKWJFFXcjs.SelectTrigger,
|
|
244
244
|
{
|
|
245
245
|
id: "companySize",
|
|
246
246
|
"aria-label": "Company Size",
|
|
247
247
|
className: "h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary",
|
|
248
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
248
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectValue, { placeholder: "Select company size" })
|
|
249
249
|
}
|
|
250
250
|
),
|
|
251
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
251
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectContent, { children: companySizeOptions.map((opt) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectItem, { value: opt, children: opt }, opt)) })
|
|
252
252
|
] })
|
|
253
253
|
}
|
|
254
254
|
),
|
|
@@ -261,17 +261,17 @@ function ContactForm({
|
|
|
261
261
|
{
|
|
262
262
|
control,
|
|
263
263
|
name: "referralSource",
|
|
264
|
-
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
264
|
+
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkHQKWJFFXcjs.Select, { onValueChange: field.onChange, defaultValue: field.value, children: [
|
|
265
265
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
266
|
-
|
|
266
|
+
_chunkHQKWJFFXcjs.SelectTrigger,
|
|
267
267
|
{
|
|
268
268
|
id: "referralSource",
|
|
269
269
|
"aria-label": "Referral Source",
|
|
270
270
|
className: "h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary",
|
|
271
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
271
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectValue, { placeholder: "Select an option" })
|
|
272
272
|
}
|
|
273
273
|
),
|
|
274
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
274
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectContent, { children: referralSourceOptions.map((opt) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectItem, { value: opt, children: opt }, opt)) })
|
|
275
275
|
] })
|
|
276
276
|
}
|
|
277
277
|
),
|
|
@@ -288,17 +288,17 @@ function ContactForm({
|
|
|
288
288
|
{
|
|
289
289
|
control,
|
|
290
290
|
name: "helpCategory",
|
|
291
|
-
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
291
|
+
render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkHQKWJFFXcjs.Select, { onValueChange: field.onChange, defaultValue: field.value, children: [
|
|
292
292
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
293
|
-
|
|
293
|
+
_chunkHQKWJFFXcjs.SelectTrigger,
|
|
294
294
|
{
|
|
295
295
|
id: "helpCategory",
|
|
296
296
|
"aria-label": "Help Category",
|
|
297
297
|
className: "h-12 border-ods-border bg-ods-card px-3 text-ods-text-primary",
|
|
298
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
298
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectValue, { placeholder: "Choose your main interest" })
|
|
299
299
|
}
|
|
300
300
|
),
|
|
301
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
301
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectContent, { children: helpCategoryOptions.map((opt) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHQKWJFFXcjs.SelectItem, { value: opt, children: opt }, opt)) })
|
|
302
302
|
] })
|
|
303
303
|
}
|
|
304
304
|
),
|
|
@@ -310,7 +310,7 @@ function ContactForm({
|
|
|
310
310
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-ods-accent", children: "*" })
|
|
311
311
|
] }),
|
|
312
312
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
313
|
-
|
|
313
|
+
_chunkHQKWJFFXcjs.Textarea,
|
|
314
314
|
{
|
|
315
315
|
id: "message",
|
|
316
316
|
...register("message"),
|
|
@@ -324,7 +324,7 @@ function ContactForm({
|
|
|
324
324
|
] }),
|
|
325
325
|
attachmentsEnabled && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-2", children: [
|
|
326
326
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
327
|
-
|
|
327
|
+
_chunkEKKR5ZFBcjs.ChatAttachmentChipStrip,
|
|
328
328
|
{
|
|
329
329
|
attachments: attachments.attachments,
|
|
330
330
|
onRemove: attachments.removeAttachment,
|
|
@@ -333,7 +333,7 @@ function ContactForm({
|
|
|
333
333
|
),
|
|
334
334
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
|
|
335
335
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
336
|
-
|
|
336
|
+
_chunkEKKR5ZFBcjs.ChatAttachmentAddButton,
|
|
337
337
|
{
|
|
338
338
|
attachmentsEnabled: true,
|
|
339
339
|
attachmentsCount: attachments.attachments.length,
|
|
@@ -369,4 +369,4 @@ function ContactForm({
|
|
|
369
369
|
|
|
370
370
|
|
|
371
371
|
exports.ContactForm = ContactForm;
|
|
372
|
-
//# sourceMappingURL=chunk-
|
|
372
|
+
//# sourceMappingURL=chunk-DPQGO4PH.cjs.map
|