@bikdotai/bik-component-library 0.0.821-beta.6 → 0.0.821-beta.7
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/cjs/components/agent-builder/AgentBuilder.styled.js +26 -16
- package/dist/cjs/components/agent-builder/AgentBuilder.styled.js.map +1 -1
- package/dist/cjs/components/agent-builder/components/SelectableListSection.js +1 -1
- package/dist/cjs/components/agent-builder/components/SelectableListSection.js.map +1 -1
- package/dist/esm/components/agent-builder/AgentBuilder.styled.d.ts +6 -0
- package/dist/esm/components/agent-builder/AgentBuilder.styled.js +50 -36
- package/dist/esm/components/agent-builder/AgentBuilder.styled.js.map +1 -1
- package/dist/esm/components/agent-builder/components/SelectableListSection.js +62 -76
- package/dist/esm/components/agent-builder/components/SelectableListSection.js.map +1 -1
- package/package.json +1 -1
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
width: 100%;
|
|
6
6
|
min-height: 0;
|
|
7
7
|
background: ${t.COLORS.surface.standard};
|
|
8
|
-
`,
|
|
8
|
+
`,s=e.default.div.attrs({className:"bik-top-bar"})`
|
|
9
9
|
display: flex;
|
|
10
10
|
align-items: center;
|
|
11
11
|
justify-content: space-between;
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
padding: 12px 16px;
|
|
14
14
|
border-bottom: 1px solid ${t.COLORS.stroke.primary};
|
|
15
15
|
flex-shrink: 0;
|
|
16
|
-
`,
|
|
16
|
+
`,o=e.default.div.attrs({className:"bik-top-bar-side"})`
|
|
17
17
|
display: flex;
|
|
18
18
|
align-items: center;
|
|
19
19
|
gap: 12px;
|
|
@@ -143,7 +143,7 @@
|
|
|
143
143
|
gap: 8px;
|
|
144
144
|
min-height: ${a=>a.minHeight??"120px"};
|
|
145
145
|
background: ${t.COLORS.surface.standard};
|
|
146
|
-
`,
|
|
146
|
+
`,R=e.default.textarea.attrs({className:"bik-ai-text-area-input"})`
|
|
147
147
|
flex: 1;
|
|
148
148
|
border: none;
|
|
149
149
|
outline: none;
|
|
@@ -158,7 +158,7 @@
|
|
|
158
158
|
&::placeholder {
|
|
159
159
|
color: ${t.COLORS.content.placeholder};
|
|
160
160
|
}
|
|
161
|
-
`,
|
|
161
|
+
`,C=e.default.div.attrs({className:"bik-card-row"})`
|
|
162
162
|
display: flex;
|
|
163
163
|
gap: 12px;
|
|
164
164
|
margin-bottom: 16px;
|
|
@@ -265,7 +265,17 @@
|
|
|
265
265
|
background: transparent;
|
|
266
266
|
padding: 0;
|
|
267
267
|
cursor: pointer;
|
|
268
|
-
`;const z=e.default.
|
|
268
|
+
`;const z=e.default.div.attrs({className:"bik-row-actions"})`
|
|
269
|
+
display: flex;
|
|
270
|
+
align-items: center;
|
|
271
|
+
gap: 4px;
|
|
272
|
+
flex-shrink: 0;
|
|
273
|
+
`,D=e.default.span.attrs({className:"bik-row-action-divider"})`
|
|
274
|
+
width: 1px;
|
|
275
|
+
align-self: stretch;
|
|
276
|
+
margin: 4px 0;
|
|
277
|
+
background: ${t.COLORS.stroke.primary};
|
|
278
|
+
`,W=e.default.button.attrs({className:"bik-row-menu-button"})`
|
|
269
279
|
display: flex;
|
|
270
280
|
align-items: center;
|
|
271
281
|
justify-content: center;
|
|
@@ -280,28 +290,28 @@
|
|
|
280
290
|
&:hover {
|
|
281
291
|
background: ${t.COLORS.surface.subdued};
|
|
282
292
|
}
|
|
283
|
-
`,
|
|
293
|
+
`,_=e.default.div.attrs({className:"bik-modal-body"})`
|
|
284
294
|
padding: 24px;
|
|
285
295
|
display: flex;
|
|
286
296
|
flex-direction: column;
|
|
287
297
|
align-items: center;
|
|
288
298
|
gap: 16px;
|
|
289
299
|
text-align: center;
|
|
290
|
-
`,
|
|
300
|
+
`,q=e.default.div.attrs({className:"bik-modal-icon"})`
|
|
291
301
|
display: flex;
|
|
292
302
|
align-items: center;
|
|
293
303
|
justify-content: center;
|
|
294
304
|
margin-bottom: 4px;
|
|
295
|
-
`,
|
|
305
|
+
`,G=e.default.div.attrs({className:"bik-modal-actions"})`
|
|
296
306
|
display: flex;
|
|
297
307
|
gap: 12px;
|
|
298
308
|
width: 100%;
|
|
299
|
-
`,
|
|
309
|
+
`,E=e.default.div.attrs({className:"bik-subagent-scrim"})`
|
|
300
310
|
position: fixed;
|
|
301
311
|
inset: 0;
|
|
302
312
|
background: rgba(0, 0, 0, 0.32);
|
|
303
313
|
z-index: 1000;
|
|
304
|
-
`,
|
|
314
|
+
`,J=e.default.div.attrs({className:"bik-subagent-panel"})`
|
|
305
315
|
position: fixed;
|
|
306
316
|
top: 0;
|
|
307
317
|
right: 0;
|
|
@@ -314,7 +324,7 @@
|
|
|
314
324
|
box-shadow: -8px 0 24px rgba(0, 0, 0, 0.12);
|
|
315
325
|
z-index: 1001;
|
|
316
326
|
box-sizing: border-box;
|
|
317
|
-
`,
|
|
327
|
+
`,K=e.default.div.attrs({className:"bik-subagent-panel-header"})`
|
|
318
328
|
display: flex;
|
|
319
329
|
align-items: flex-start;
|
|
320
330
|
justify-content: space-between;
|
|
@@ -322,12 +332,12 @@
|
|
|
322
332
|
padding: 16px;
|
|
323
333
|
border-bottom: 1px solid ${t.COLORS.stroke.primary};
|
|
324
334
|
flex-shrink: 0;
|
|
325
|
-
`,
|
|
335
|
+
`,Q=e.default.div.attrs({className:"bik-subagent-panel-header-text"})`
|
|
326
336
|
display: flex;
|
|
327
337
|
flex-direction: column;
|
|
328
338
|
gap: 4px;
|
|
329
339
|
min-width: 0;
|
|
330
|
-
`,
|
|
340
|
+
`,U=e.default.div.attrs({className:"bik-subagent-panel-body"})`
|
|
331
341
|
flex: 1;
|
|
332
342
|
min-height: 0;
|
|
333
343
|
overflow-y: auto;
|
|
@@ -335,7 +345,7 @@
|
|
|
335
345
|
display: flex;
|
|
336
346
|
flex-direction: column;
|
|
337
347
|
gap: 20px;
|
|
338
|
-
`,
|
|
348
|
+
`,V=e.default.div.attrs({className:"bik-subagent-panel-footer"})`
|
|
339
349
|
display: flex;
|
|
340
350
|
align-items: center;
|
|
341
351
|
gap: 8px;
|
|
@@ -343,7 +353,7 @@
|
|
|
343
353
|
min-height: 48px;
|
|
344
354
|
border-top: 1px solid ${t.COLORS.stroke.primary};
|
|
345
355
|
flex-shrink: 0;
|
|
346
|
-
`,
|
|
356
|
+
`,X=e.default.button.attrs({className:"bik-subagent-close"})`
|
|
347
357
|
display: flex;
|
|
348
358
|
align-items: center;
|
|
349
359
|
justify-content: center;
|
|
@@ -363,5 +373,5 @@
|
|
|
363
373
|
display: flex;
|
|
364
374
|
align-items: center;
|
|
365
375
|
gap: 8px;
|
|
366
|
-
`;exports.AddChipButton=B;exports.AddIconButton=M;exports.AiTextAreaInput=
|
|
376
|
+
`;exports.AddChipButton=B;exports.AddIconButton=M;exports.AiTextAreaInput=R;exports.AiTextAreaShell=O;exports.BackButton=d;exports.BuilderRoot=r;exports.CardRow=C;exports.ChipCloseButton=A;exports.ChipWrap=N;exports.Content=p;exports.ContentCard=u;exports.FieldBlock=y;exports.FieldLabelRow=S;exports.Footer=x;exports.FooterActions=f;exports.FooterHint=b;exports.IntentChip=L;exports.Main=l;exports.ModalActions=G;exports.ModalBody=_;exports.ModalIcon=q;exports.RadioCard=v;exports.RadioCardText=w;exports.Rail=c;exports.RailItem=m;exports.RailList=g;exports.RowActionDivider=D;exports.RowActions=z;exports.RowMenuButton=W;exports.RowText=P;exports.SectionHeaderWrap=k;exports.SelectableRow=H;exports.SideSection=F;exports.SideSectionHeader=I;exports.Step3Grid=$;exports.Step3Main=T;exports.Step3Side=j;exports.StepBadge=h;exports.SubAgentCloseButton=X;exports.SubAgentPanel=J;exports.SubAgentPanelBody=U;exports.SubAgentPanelFooter=V;exports.SubAgentPanelHeader=K;exports.SubAgentPanelHeaderText=Q;exports.SubAgentScrim=E;exports.TopBar=s;exports.TopBarSide=o;
|
|
367
377
|
//# sourceMappingURL=AgentBuilder.styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AgentBuilder.styled.js","sources":["../../../../src/components/agent-builder/AgentBuilder.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const BuilderRoot = styled.div.attrs({ className: 'bik-builder-root' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n\twidth: 100%;\n\tmin-height: 0;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const TopBar = styled.div.attrs({ className: 'bik-top-bar' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\theight: 56px;\n\tpadding: 12px 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const TopBarSide = styled.div.attrs({ className: 'bik-top-bar-side' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n`;\n\nexport const BackButton = styled.button.attrs({ className: 'bik-back-button' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 28px;\n\theight: 28px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\nexport const Main = styled.div.attrs({ className: 'bik-main' })`\n\tdisplay: flex;\n\tflex: 1;\n\tmin-height: 0;\n`;\n\nexport const Rail = styled.div.attrs({ className: 'bik-rail' })`\n\twidth: 234px;\n\tflex-shrink: 0;\n\tborder-right: 1px solid ${COLORS.stroke.primary};\n\tpadding: 16px;\n\toverflow-y: auto;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const Content = styled.div.attrs({ className: 'bik-content' })`\n\tflex: 1;\n\tmin-width: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ContentCard = styled.div.attrs({ className: 'bik-content-card' })`\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tpadding: 24px;\n\tmin-height: 100%;\n\tbox-sizing: border-box;\n`;\n\nexport const Footer = styled.div.attrs({ className: 'bik-footer' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tmin-height: 56px;\n\tpadding: 12px 16px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const FooterHint = styled.div.attrs({ className: 'bik-footer-hint' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 6px;\n`;\n\nexport const FooterActions = styled.div.attrs({\n\tclassName: 'bik-footer-actions',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n\n// ── Step rail items ─────────────────────────────────────────────────────────\n\nexport const RailList = styled.div.attrs({ className: 'bik-rail-list' })`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const RailItem = styled.button.attrs({ className: 'bik-rail-item' })`\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 8px;\n\t/* Bottom padding leaves room for the connector down to the next badge. */\n\tpadding: 0 0 24px;\n\tborder: none;\n\tbackground: transparent;\n\tcursor: pointer;\n\ttext-align: left;\n\twidth: 100%;\n\n\t&:last-child {\n\t\tpadding-bottom: 0;\n\t}\n\n\t&:disabled {\n\t\tcursor: default;\n\t}\n\n\t/* Dashed connector line between consecutive step badges (centered on the badge). */\n\t&:not(:last-child)::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: 9px;\n\t\ttop: 20px;\n\t\twidth: 0;\n\t\theight: 24px;\n\t\tborder-left: 1px dashed #e0e0e0;\n\t\tpointer-events: none;\n\t}\n`;\n\nexport const StepBadge = styled.div.attrs({ className: 'bik-step-badge' })<{\n\tstate: 'active' | 'complete' | 'inactive';\n}>`\n\twidth: 20px;\n\theight: 20px;\n\tflex-shrink: 0;\n\tborder-radius: 50%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tbackground: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.content.brand\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.background.brandTint\n\t\t\t: '#F0F0F0'};\n\tcolor: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.content.primaryInverse\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.content.brand\n\t\t\t: COLORS.content.placeholder};\n`;\n\n// ── Shared step pieces ──────────────────────────────────────────────────────\n\nexport const SectionHeaderWrap = styled.div.attrs({\n\tclassName: 'bik-section-header-wrap',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmargin-bottom: 20px;\n`;\n\nexport const FieldBlock = styled.div.attrs({ className: 'bik-field-block' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n\tmargin-bottom: 20px;\n`;\n\nexport const FieldLabelRow = styled.div.attrs({\n\tclassName: 'bik-field-label-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n`;\n\n// ── Labelled text area ──────────────────────────────────────────────────────\n\nexport const AiTextAreaShell = styled.div.attrs({\n\tclassName: 'bik-ai-text-area-shell',\n})<{\n\tfocused?: boolean;\n\tminHeight?: string;\n}>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tborder: 1px solid\n\t\t${(p) => (p.focused ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tborder-radius: 4px;\n\tpadding: 8px 12px;\n\tgap: 8px;\n\tmin-height: ${(p) => p.minHeight ?? '120px'};\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const AiTextAreaInput = styled.textarea.attrs({\n\tclassName: 'bik-ai-text-area-input',\n})`\n\tflex: 1;\n\tborder: none;\n\toutline: none;\n\tresize: none;\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tline-height: 20px;\n\tcolor: ${COLORS.content.primary};\n\tbackground: transparent;\n\tmin-height: 60px;\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n`;\n\n// ── Radio card (Step 2 / Step 4 option cards) ───────────────────────────────\n\nexport const CardRow = styled.div.attrs({ className: 'bik-card-row' })`\n\tdisplay: flex;\n\tgap: 12px;\n\tmargin-bottom: 16px;\n`;\n\nexport const RadioCard = styled.button.attrs({ className: 'bik-radio-card' })<{\n\tselected?: boolean;\n}>`\n\tflex: 1;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 12px;\n\tpadding: 16px;\n\tborder: 1px solid\n\t\t${(p) => (p.selected ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tbackground: ${(p) =>\n\t\tp.selected ? COLORS.background.brandLight : COLORS.surface.standard};\n\tborder-radius: 8px;\n\tcursor: pointer;\n\ttext-align: left;\n\twidth: 100%;\n`;\n\nexport const RadioCardText = styled.div.attrs({\n\tclassName: 'bik-radio-card-text',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n`;\n\n// ── Intent chips (Step 2) ───────────────────────────────────────────────────\n\nexport const ChipWrap = styled.div.attrs({ className: 'bik-chip-wrap' })`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 8px;\n`;\n\nexport const IntentChip = styled.div.attrs({ className: 'bik-intent-chip' })`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 4px 8px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ChipCloseButton = styled.button.attrs({\n\tclassName: 'bik-chip-close-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n`;\n\nexport const AddChipButton = styled.button.attrs({\n\tclassName: 'bik-add-chip-button',\n})`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 4px 8px;\n\tborder: 1px dashed ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: transparent;\n\tcursor: pointer;\n`;\n\n// ── Step 3 two-column layout + tool / sub-agent rows ────────────────────────\n\nexport const Step3Grid = styled.div.attrs({ className: 'bik-step3-grid' })`\n\tdisplay: grid;\n\tgrid-template-columns: minmax(0, 1fr) 300px;\n\tgap: 24px;\n\n\t@media (max-width: 1100px) {\n\t\tgrid-template-columns: 1fr;\n\t}\n`;\n\nexport const Step3Main = styled.div.attrs({ className: 'bik-step3-main' })`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const Step3Side = styled.div.attrs({ className: 'bik-step3-side' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 24px;\n`;\n\nexport const SideSection = styled.div.attrs({ className: 'bik-side-section' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\nexport const SideSectionHeader = styled.div.attrs({\n\tclassName: 'bik-side-section-header',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n`;\n\nexport const AddIconButton = styled.button.attrs({\n\tclassName: 'bik-add-icon-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\nexport const SelectableRow = styled.div.attrs({\n\tclassName: 'bik-selectable-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\n\nexport const RowText = styled.div.attrs({ className: 'bik-row-text' })`\n\tflex: 1;\n\tmin-width: 0;\n`;\n\nexport const RowRemoveButton = styled.button.attrs({\n\tclassName: 'bik-row-remove-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n`;\n\n// ── Row kebab (⋮) trigger — popover/menu come from the shared DropdownPopover ──\n\nexport const RowMenuButton = styled.button.attrs({\n\tclassName: 'bik-row-menu-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n// ── Go-live modal ───────────────────────────────────────────────────────────\n\nexport const ModalBody = styled.div.attrs({ className: 'bik-modal-body' })`\n\tpadding: 24px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tgap: 16px;\n\ttext-align: center;\n`;\n\nexport const ModalIcon = styled.div.attrs({ className: 'bik-modal-icon' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmargin-bottom: 4px;\n`;\n\nexport const ModalActions = styled.div.attrs({\n\tclassName: 'bik-modal-actions',\n})`\n\tdisplay: flex;\n\tgap: 12px;\n\twidth: 100%;\n`;\n\n// ── Create sub-agent drawer ─────────────────────────────────────────────────\n\nexport const SubAgentScrim = styled.div.attrs({\n\tclassName: 'bik-subagent-scrim',\n})`\n\tposition: fixed;\n\tinset: 0;\n\tbackground: rgba(0, 0, 0, 0.32);\n\tz-index: 1000;\n`;\n\nexport const SubAgentPanel = styled.div.attrs({\n\tclassName: 'bik-subagent-panel',\n})`\n\tposition: fixed;\n\ttop: 0;\n\tright: 0;\n\theight: 100%;\n\twidth: 421px;\n\tmax-width: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tbackground: ${COLORS.surface.standard};\n\tbox-shadow: -8px 0 24px rgba(0, 0, 0, 0.12);\n\tz-index: 1001;\n\tbox-sizing: border-box;\n`;\n\nexport const SubAgentPanelHeader = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-header',\n})`\n\tdisplay: flex;\n\talign-items: flex-start;\n\tjustify-content: space-between;\n\tgap: 12px;\n\tpadding: 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const SubAgentPanelHeaderText = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-header-text',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmin-width: 0;\n`;\n\nexport const SubAgentPanelBody = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-body',\n})`\n\tflex: 1;\n\tmin-height: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 20px;\n`;\n\nexport const SubAgentPanelFooter = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-footer',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tmin-height: 48px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const SubAgentCloseButton = styled.button.attrs({\n\tclassName: 'bik-subagent-close',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\tflex-shrink: 0;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n/** Inline action row inside a rich field (e.g. \"Improve with AI\"). */\nexport const FieldActionRow = styled.div.attrs({\n\tclassName: 'bik-field-action-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n"],"names":["BuilderRoot","styled","COLORS","TopBar","TopBarSide","BackButton","Main","Rail","Content","ContentCard","Footer","FooterHint","FooterActions","RailList","RailItem","StepBadge","p","SectionHeaderWrap","FieldBlock","FieldLabelRow","AiTextAreaShell","AiTextAreaInput","CardRow","RadioCard","RadioCardText","ChipWrap","IntentChip","ChipCloseButton","AddChipButton","Step3Grid","Step3Main","Step3Side","SideSection","SideSectionHeader","AddIconButton","SelectableRow","RowText","RowMenuButton","ModalBody","ModalIcon","ModalActions","SubAgentScrim","SubAgentPanel","SubAgentPanelHeader","SubAgentPanelHeaderText","SubAgentPanelBody","SubAgentPanelFooter","SubAgentCloseButton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AgentBuilder.styled.js","sources":["../../../../src/components/agent-builder/AgentBuilder.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const BuilderRoot = styled.div.attrs({ className: 'bik-builder-root' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n\twidth: 100%;\n\tmin-height: 0;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const TopBar = styled.div.attrs({ className: 'bik-top-bar' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\theight: 56px;\n\tpadding: 12px 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const TopBarSide = styled.div.attrs({ className: 'bik-top-bar-side' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n`;\n\nexport const BackButton = styled.button.attrs({ className: 'bik-back-button' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 28px;\n\theight: 28px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\nexport const Main = styled.div.attrs({ className: 'bik-main' })`\n\tdisplay: flex;\n\tflex: 1;\n\tmin-height: 0;\n`;\n\nexport const Rail = styled.div.attrs({ className: 'bik-rail' })`\n\twidth: 234px;\n\tflex-shrink: 0;\n\tborder-right: 1px solid ${COLORS.stroke.primary};\n\tpadding: 16px;\n\toverflow-y: auto;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const Content = styled.div.attrs({ className: 'bik-content' })`\n\tflex: 1;\n\tmin-width: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ContentCard = styled.div.attrs({ className: 'bik-content-card' })`\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tpadding: 24px;\n\tmin-height: 100%;\n\tbox-sizing: border-box;\n`;\n\nexport const Footer = styled.div.attrs({ className: 'bik-footer' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tmin-height: 56px;\n\tpadding: 12px 16px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const FooterHint = styled.div.attrs({ className: 'bik-footer-hint' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 6px;\n`;\n\nexport const FooterActions = styled.div.attrs({\n\tclassName: 'bik-footer-actions',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n\n// ── Step rail items ─────────────────────────────────────────────────────────\n\nexport const RailList = styled.div.attrs({ className: 'bik-rail-list' })`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const RailItem = styled.button.attrs({ className: 'bik-rail-item' })`\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 8px;\n\t/* Bottom padding leaves room for the connector down to the next badge. */\n\tpadding: 0 0 24px;\n\tborder: none;\n\tbackground: transparent;\n\tcursor: pointer;\n\ttext-align: left;\n\twidth: 100%;\n\n\t&:last-child {\n\t\tpadding-bottom: 0;\n\t}\n\n\t&:disabled {\n\t\tcursor: default;\n\t}\n\n\t/* Dashed connector line between consecutive step badges (centered on the badge). */\n\t&:not(:last-child)::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: 9px;\n\t\ttop: 20px;\n\t\twidth: 0;\n\t\theight: 24px;\n\t\tborder-left: 1px dashed #e0e0e0;\n\t\tpointer-events: none;\n\t}\n`;\n\nexport const StepBadge = styled.div.attrs({ className: 'bik-step-badge' })<{\n\tstate: 'active' | 'complete' | 'inactive';\n}>`\n\twidth: 20px;\n\theight: 20px;\n\tflex-shrink: 0;\n\tborder-radius: 50%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tbackground: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.content.brand\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.background.brandTint\n\t\t\t: '#F0F0F0'};\n\tcolor: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.content.primaryInverse\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.content.brand\n\t\t\t: COLORS.content.placeholder};\n`;\n\n// ── Shared step pieces ──────────────────────────────────────────────────────\n\nexport const SectionHeaderWrap = styled.div.attrs({\n\tclassName: 'bik-section-header-wrap',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmargin-bottom: 20px;\n`;\n\nexport const FieldBlock = styled.div.attrs({ className: 'bik-field-block' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n\tmargin-bottom: 20px;\n`;\n\nexport const FieldLabelRow = styled.div.attrs({\n\tclassName: 'bik-field-label-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n`;\n\n// ── Labelled text area ──────────────────────────────────────────────────────\n\nexport const AiTextAreaShell = styled.div.attrs({\n\tclassName: 'bik-ai-text-area-shell',\n})<{\n\tfocused?: boolean;\n\tminHeight?: string;\n}>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tborder: 1px solid\n\t\t${(p) => (p.focused ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tborder-radius: 4px;\n\tpadding: 8px 12px;\n\tgap: 8px;\n\tmin-height: ${(p) => p.minHeight ?? '120px'};\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const AiTextAreaInput = styled.textarea.attrs({\n\tclassName: 'bik-ai-text-area-input',\n})`\n\tflex: 1;\n\tborder: none;\n\toutline: none;\n\tresize: none;\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tline-height: 20px;\n\tcolor: ${COLORS.content.primary};\n\tbackground: transparent;\n\tmin-height: 60px;\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n`;\n\n// ── Radio card (Step 2 / Step 4 option cards) ───────────────────────────────\n\nexport const CardRow = styled.div.attrs({ className: 'bik-card-row' })`\n\tdisplay: flex;\n\tgap: 12px;\n\tmargin-bottom: 16px;\n`;\n\nexport const RadioCard = styled.button.attrs({ className: 'bik-radio-card' })<{\n\tselected?: boolean;\n}>`\n\tflex: 1;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 12px;\n\tpadding: 16px;\n\tborder: 1px solid\n\t\t${(p) => (p.selected ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tbackground: ${(p) =>\n\t\tp.selected ? COLORS.background.brandLight : COLORS.surface.standard};\n\tborder-radius: 8px;\n\tcursor: pointer;\n\ttext-align: left;\n\twidth: 100%;\n`;\n\nexport const RadioCardText = styled.div.attrs({\n\tclassName: 'bik-radio-card-text',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n`;\n\n// ── Intent chips (Step 2) ───────────────────────────────────────────────────\n\nexport const ChipWrap = styled.div.attrs({ className: 'bik-chip-wrap' })`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 8px;\n`;\n\nexport const IntentChip = styled.div.attrs({ className: 'bik-intent-chip' })`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 4px 8px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ChipCloseButton = styled.button.attrs({\n\tclassName: 'bik-chip-close-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n`;\n\nexport const AddChipButton = styled.button.attrs({\n\tclassName: 'bik-add-chip-button',\n})`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 4px 8px;\n\tborder: 1px dashed ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: transparent;\n\tcursor: pointer;\n`;\n\n// ── Step 3 two-column layout + tool / sub-agent rows ────────────────────────\n\nexport const Step3Grid = styled.div.attrs({ className: 'bik-step3-grid' })`\n\tdisplay: grid;\n\tgrid-template-columns: minmax(0, 1fr) 300px;\n\tgap: 24px;\n\n\t@media (max-width: 1100px) {\n\t\tgrid-template-columns: 1fr;\n\t}\n`;\n\nexport const Step3Main = styled.div.attrs({ className: 'bik-step3-main' })`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const Step3Side = styled.div.attrs({ className: 'bik-step3-side' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 24px;\n`;\n\nexport const SideSection = styled.div.attrs({ className: 'bik-side-section' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\nexport const SideSectionHeader = styled.div.attrs({\n\tclassName: 'bik-side-section-header',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n`;\n\nexport const AddIconButton = styled.button.attrs({\n\tclassName: 'bik-add-icon-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\nexport const SelectableRow = styled.div.attrs({\n\tclassName: 'bik-selectable-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\n\nexport const RowText = styled.div.attrs({ className: 'bik-row-text' })`\n\tflex: 1;\n\tmin-width: 0;\n`;\n\nexport const RowRemoveButton = styled.button.attrs({\n\tclassName: 'bik-row-remove-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n`;\n\n// ── Per-row actions (always-visible edit / delete icon buttons) ───────────────\n\nexport const RowActions = styled.div.attrs({ className: 'bik-row-actions' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\tflex-shrink: 0;\n`;\n\n// Vertical separator between the edit and delete icon buttons.\nexport const RowActionDivider = styled.span.attrs({\n\tclassName: 'bik-row-action-divider',\n})`\n\twidth: 1px;\n\talign-self: stretch;\n\tmargin: 4px 0;\n\tbackground: ${COLORS.stroke.primary};\n`;\n\nexport const RowMenuButton = styled.button.attrs({\n\tclassName: 'bik-row-menu-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n// ── Go-live modal ───────────────────────────────────────────────────────────\n\nexport const ModalBody = styled.div.attrs({ className: 'bik-modal-body' })`\n\tpadding: 24px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tgap: 16px;\n\ttext-align: center;\n`;\n\nexport const ModalIcon = styled.div.attrs({ className: 'bik-modal-icon' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmargin-bottom: 4px;\n`;\n\nexport const ModalActions = styled.div.attrs({\n\tclassName: 'bik-modal-actions',\n})`\n\tdisplay: flex;\n\tgap: 12px;\n\twidth: 100%;\n`;\n\n// ── Create sub-agent drawer ─────────────────────────────────────────────────\n\nexport const SubAgentScrim = styled.div.attrs({\n\tclassName: 'bik-subagent-scrim',\n})`\n\tposition: fixed;\n\tinset: 0;\n\tbackground: rgba(0, 0, 0, 0.32);\n\tz-index: 1000;\n`;\n\nexport const SubAgentPanel = styled.div.attrs({\n\tclassName: 'bik-subagent-panel',\n})`\n\tposition: fixed;\n\ttop: 0;\n\tright: 0;\n\theight: 100%;\n\twidth: 421px;\n\tmax-width: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tbackground: ${COLORS.surface.standard};\n\tbox-shadow: -8px 0 24px rgba(0, 0, 0, 0.12);\n\tz-index: 1001;\n\tbox-sizing: border-box;\n`;\n\nexport const SubAgentPanelHeader = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-header',\n})`\n\tdisplay: flex;\n\talign-items: flex-start;\n\tjustify-content: space-between;\n\tgap: 12px;\n\tpadding: 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const SubAgentPanelHeaderText = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-header-text',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmin-width: 0;\n`;\n\nexport const SubAgentPanelBody = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-body',\n})`\n\tflex: 1;\n\tmin-height: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 20px;\n`;\n\nexport const SubAgentPanelFooter = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-footer',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tmin-height: 48px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const SubAgentCloseButton = styled.button.attrs({\n\tclassName: 'bik-subagent-close',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\tflex-shrink: 0;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n/** Inline action row inside a rich field (e.g. \"Improve with AI\"). */\nexport const FieldActionRow = styled.div.attrs({\n\tclassName: 'bik-field-action-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n"],"names":["BuilderRoot","styled","COLORS","TopBar","TopBarSide","BackButton","Main","Rail","Content","ContentCard","Footer","FooterHint","FooterActions","RailList","RailItem","StepBadge","p","SectionHeaderWrap","FieldBlock","FieldLabelRow","AiTextAreaShell","AiTextAreaInput","CardRow","RadioCard","RadioCardText","ChipWrap","IntentChip","ChipCloseButton","AddChipButton","Step3Grid","Step3Main","Step3Side","SideSection","SideSectionHeader","AddIconButton","SelectableRow","RowText","RowActions","RowActionDivider","RowMenuButton","ModalBody","ModalIcon","ModalActions","SubAgentScrim","SubAgentPanel","SubAgentPanelHeader","SubAgentPanelHeaderText","SubAgentPanelBody","SubAgentPanelFooter","SubAgentCloseButton"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),C=require("../../../assets/icons/delete.svg.js"),O=require("../../../assets/icons/edit.svg.js"),L=require("../../../assets/icons/plus.svg.js"),A=require("react"),c=require("../../TypographyStyle.js"),o=require("../../../constants/Theme.js"),t=require("../AgentBuilder.styled.js"),$=require("../../dropdown/Dropdown.js"),w="__bik_create_new__",_=({title:d,helper:h,items:u,addableOptions:s,onAdd:b,onRemove:x,dataTestPrefix:r,emptyText:R,createOption:l,onConfigure:i})=>{const[S,j]=A.useState(!1),g=s.length>0||!!l,y=l?[...s,{label:l.label,value:w,searchKey:l.label,customComponent:e.jsx("div",{style:{width:"100%",textAlign:"center",color:o.COLORS.content.brand,fontFamily:"Inter",fontSize:14,fontWeight:600},children:l.label})}]:s;return e.jsxs(t.SideSection,{children:[e.jsxs(t.SideSectionHeader,{children:[e.jsx(c.TitleSmall,{color:o.COLORS.content.primary,children:d}),g&&e.jsx(t.AddIconButton,{"data-test":`${r}-add`,onClick:()=>j(n=>!n),"aria-label":`Add ${d}`,children:e.jsx(L.default,{width:20,height:20,color:o.COLORS.content.brand})})]}),h&&e.jsx(c.BodyCaption,{color:o.COLORS.content.secondary,children:h}),S&&y.length>0&&e.jsx($.Dropdown,{"data-test":`${r}-dropdown`,size:"small",width:"100%",isSearchable:!0,placeHolder:`Select ${d.toLowerCase()}`,options:y,onSelect:n=>{const a=(Array.isArray(n)?n[0]:n)?.value;j(!1),a&&(a===w?l?.onSelect():b(a))}}),u.length===0&&!S?e.jsx(c.BodyCaption,{color:o.COLORS.content.placeholder,children:R}):u.map(n=>e.jsxs(t.SelectableRow,{"data-test":`${r}-row-${n.id}`,children:[e.jsx(t.RowText,{children:e.jsx(c.BodySecondary,{numberOfLines:1,color:o.COLORS.content.primary,children:n.label})}),e.jsxs(t.RowActions,{children:[i&&e.jsx(t.RowMenuButton,{"data-test":`${r}-edit-${n.id}`,"aria-label":`Edit ${n.label}`,onClick:()=>i(n.id),children:e.jsx(O.default,{width:16,height:16,color:o.COLORS.content.secondary})}),i&&e.jsx(t.RowActionDivider,{"aria-hidden":!0}),e.jsx(t.RowMenuButton,{"data-test":`${r}-delete-${n.id}`,"aria-label":`Delete ${n.label}`,onClick:()=>x(n.id),children:e.jsx(C.default,{width:16,height:16,color:o.COLORS.content.secondary})})]})]},n.id))]})};exports.SelectableListSection=_;
|
|
2
2
|
//# sourceMappingURL=SelectableListSection.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectableListSection.js","sources":["../../../../../src/components/agent-builder/components/SelectableListSection.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport VerticalDotsIcon from '@src/assets/icons/vertical_dots.svg';\nimport React, { useState } from 'react';\nimport { Dropdown, DropdownPopover } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tAddIconButton,\n\tRowMenuButton,\n\tRowText,\n\tSelectableRow,\n\tSideSection,\n\tSideSectionHeader,\n} from '../AgentBuilder.styled';\n\nexport interface SelectableItem {\n\tid: string;\n\tlabel: string;\n}\n\n/** Sentinel value for the \"create new\" entry in the add dropdown. */\nconst CREATE_OPTION_VALUE = '__bik_create_new__';\n/** Sentinels for the per-row kebab menu actions. */\nconst ROW_CONFIGURE_VALUE = '__bik_configure__';\nconst ROW_DELETE_VALUE = '__bik_delete__';\n\ninterface SelectableListSectionProps {\n\ttitle: string;\n\thelper?: string;\n\titems: SelectableItem[];\n\t/**\n\t * Options shown in the add dropdown. Pass ALL items (not just unselected\n\t * ones) when re-picking an already-added item is allowed (e.g. to insert its\n\t * mention again) — the chip list still shows each item only once.\n\t */\n\taddableOptions: SingleOption[];\n\tonAdd: (id: string) => void;\n\tonRemove: (id: string) => void;\n\tdataTestPrefix: string;\n\temptyText: string;\n\t/**\n\t * Adds a \"create new\" entry at the top of the add dropdown (e.g. \"Create\n\t * sub-agent\"). Selecting it calls `onSelect` instead of `onAdd`.\n\t */\n\tcreateOption?: { label: string; onSelect: () => void };\n\t/**\n\t * When provided, each row's kebab menu gains a \"Configure\" action (above\n\t * \"Delete\"). Omit for tools (Delete only).\n\t */\n\tonConfigure?: (id: string) => void;\n}\n\nexport const SelectableListSection: React.FC<SelectableListSectionProps> = ({\n\ttitle,\n\thelper,\n\titems,\n\taddableOptions,\n\tonAdd,\n\tonRemove,\n\tdataTestPrefix,\n\temptyText,\n\tcreateOption,\n\tonConfigure,\n}) => {\n\tconst [adding, setAdding] = useState(false);\n\tconst showAddButton = addableOptions.length > 0 || !!createOption;\n\t// \"Create new\" is a brand-coloured footer row at the BOTTOM of the dropdown,\n\t// separated from the selectable items by a divider.\n\tconst dropdownOptions: SingleOption[] = createOption\n\t\t? [\n\t\t\t\t...addableOptions,\n\t\t\t\t{\n\t\t\t\t\tlabel: createOption.label,\n\t\t\t\t\tvalue: CREATE_OPTION_VALUE,\n\t\t\t\t\tsearchKey: createOption.label,\n\t\t\t\t\tcustomComponent: (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tcolor: COLORS.content.brand,\n\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\tfontSize: 14,\n\t\t\t\t\t\t\t\tfontWeight: 600,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{createOption.label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t),\n\t\t\t\t},\n\t\t ]\n\t\t: addableOptions;\n\n\t// Per-row kebab menu: Delete (red) always; Configure above it when allowed.\n\tconst rowMenuOptions: SingleOption[] = [\n\t\t...(onConfigure\n\t\t\t? [{ label: 'Configure', value: ROW_CONFIGURE_VALUE }]\n\t\t\t: []),\n\t\t{\n\t\t\tlabel: 'Delete',\n\t\t\tvalue: ROW_DELETE_VALUE,\n\t\t\tcustomComponent: (\n\t\t\t\t<BodySecondary color={COLORS.content.negative}>Delete</BodySecondary>\n\t\t\t),\n\t\t},\n\t];\n\n\treturn (\n\t\t<SideSection>\n\t\t\t<SideSectionHeader>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>{title}</TitleSmall>\n\t\t\t\t{showAddButton && (\n\t\t\t\t\t<AddIconButton\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-add`}\n\t\t\t\t\t\tonClick={() => setAdding((v) => !v)}\n\t\t\t\t\t\taria-label={`Add ${title}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PlusIcon width={20} height={20} color={COLORS.content.brand} />\n\t\t\t\t\t</AddIconButton>\n\t\t\t\t)}\n\t\t\t</SideSectionHeader>\n\n\t\t\t{helper && (\n\t\t\t\t<BodyCaption color={COLORS.content.secondary}>{helper}</BodyCaption>\n\t\t\t)}\n\n\t\t\t{adding && dropdownOptions.length > 0 && (\n\t\t\t\t<Dropdown\n\t\t\t\t\tdata-test={`${dataTestPrefix}-dropdown`}\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\tisSearchable\n\t\t\t\t\tplaceHolder={`Select ${title.toLowerCase()}`}\n\t\t\t\t\toptions={dropdownOptions}\n\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\tconst single = Array.isArray(opt) ? opt[0] : opt;\n\t\t\t\t\t\tconst v = (single as SingleOption)?.value;\n\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\tif (!v) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (v === CREATE_OPTION_VALUE) {\n\t\t\t\t\t\t\tcreateOption?.onSelect();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonAdd(v);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{items.length === 0 && !adding ? (\n\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t{emptyText}\n\t\t\t\t</BodyCaption>\n\t\t\t) : (\n\t\t\t\titems.map((item) => (\n\t\t\t\t\t<SelectableRow\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-row-${item.id}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<RowText>\n\t\t\t\t\t\t\t<BodySecondary numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</RowText>\n\t\t\t\t\t\t{onConfigure ? (\n\t\t\t\t\t\t\t// Multiple actions (Configure + Delete) → kebab menu.\n\t\t\t\t\t\t\t<DropdownPopover\n\t\t\t\t\t\t\t\tplacement=\"bottom-end\"\n\t\t\t\t\t\t\t\toptions={rowMenuOptions}\n\t\t\t\t\t\t\t\twidth=\"150px\"\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-menu-${item.id}`}\n\t\t\t\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\t\t\t\tconst single = Array.isArray(opt) ? opt[0] : opt;\n\t\t\t\t\t\t\t\t\tconst v = (single as SingleOption)?.value;\n\t\t\t\t\t\t\t\t\tif (v === ROW_CONFIGURE_VALUE) {\n\t\t\t\t\t\t\t\t\t\tonConfigure?.(item.id);\n\t\t\t\t\t\t\t\t\t} else if (v === ROW_DELETE_VALUE) {\n\t\t\t\t\t\t\t\t\t\tonRemove(item.id);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<RowMenuButton aria-label={`Options for ${item.label}`}>\n\t\t\t\t\t\t\t\t\t<VerticalDotsIcon\n\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t\t</DropdownPopover>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t// Delete-only → direct delete icon, no kebab/popover.\n\t\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-${item.id}`}\n\t\t\t\t\t\t\t\taria-label={`Delete ${item.label}`}\n\t\t\t\t\t\t\t\tonClick={() => onRemove(item.id)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</SelectableRow>\n\t\t\t\t))\n\t\t\t)}\n\t\t</SideSection>\n\t);\n};\n"],"names":["CREATE_OPTION_VALUE","ROW_CONFIGURE_VALUE","ROW_DELETE_VALUE","SelectableListSection","title","helper","items","addableOptions","onAdd","onRemove","dataTestPrefix","emptyText","createOption","onConfigure","adding","setAdding","useState","showAddButton","dropdownOptions","jsx","COLORS","rowMenuOptions","BodySecondary","SideSection","jsxs","SideSectionHeader","TitleSmall","AddIconButton","v","PlusIcon","BodyCaption","Dropdown","opt","item","SelectableRow","RowText","DropdownPopover","RowMenuButton","VerticalDotsIcon","DeleteIcon"],"mappings":"mfA2BMA,EAAsB,qBAEtBC,EAAsB,oBACtBC,EAAmB,iBA4BZC,EAA8D,CAAC,CAC3E,MAAAC,EACA,OAAAC,EACA,MAAAC,EACA,eAAAC,EACA,MAAAC,EACA,SAAAC,EACA,eAAAC,EACA,UAAAC,EACA,aAAAC,EACA,YAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAQC,CAAS,EAAIC,EAAAA,SAAS,EAAK,EACpCC,EAAgBV,EAAe,OAAS,GAAK,CAAC,CAACK,EAG/CM,EAAkCN,EACrC,CACA,GAAGL,EACH,CACC,MAAOK,EAAa,MACpB,MAAOZ,EACP,UAAWY,EAAa,MACxB,gBACCO,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,MAAO,OACP,UAAW,SACX,MAAOC,EAAAA,OAAO,QAAQ,MACtB,WAAY,QACZ,SAAU,GACV,WAAY,GAAA,EAGZ,SAAAR,EAAa,KAAA,CAAA,CACf,CAEF,EAEAL,EAGGc,EAAiC,CACtC,GAAIR,EACD,CAAC,CAAE,MAAO,YAAa,MAAOZ,CAAA,CAAqB,EACnD,CAAA,EACH,CACC,MAAO,SACP,MAAOC,EACP,gBACCiB,EAAAA,IAACG,EAAAA,cAAA,CAAc,MAAOF,EAAAA,OAAO,QAAQ,SAAU,SAAA,QAAA,CAAM,CAAA,CAEvD,EAGD,cACEG,cAAA,CACA,SAAA,CAAAC,OAACC,EAAAA,kBAAA,CACA,SAAA,CAAAN,MAACO,EAAAA,WAAA,CAAW,MAAON,EAAAA,OAAO,QAAQ,QAAU,SAAAhB,EAAM,EACjDa,GACAE,EAAAA,IAACQ,EAAAA,cAAA,CACA,YAAW,GAAGjB,CAAc,OAC5B,QAAS,IAAMK,EAAWa,GAAM,CAACA,CAAC,EAClC,aAAY,OAAOxB,CAAK,GAExB,SAAAe,EAAAA,IAACU,WAAS,MAAO,GAAI,OAAQ,GAAI,MAAOT,SAAO,QAAQ,KAAA,CAAO,CAAA,CAAA,CAC/D,EAEF,EAECf,GACAc,EAAAA,IAACW,EAAAA,YAAA,CAAY,MAAOV,SAAO,QAAQ,UAAY,SAAAf,EAAO,EAGtDS,GAAUI,EAAgB,OAAS,GACnCC,EAAAA,IAACY,EAAAA,SAAA,CACA,YAAW,GAAGrB,CAAc,YAC5B,KAAK,QACL,MAAM,OACN,aAAY,GACZ,YAAa,UAAUN,EAAM,YAAA,CAAa,GAC1C,QAASc,EACT,SAAWc,GAAQ,CAElB,MAAMJ,GADS,MAAM,QAAQI,CAAG,EAAIA,EAAI,CAAC,EAAIA,IACT,MACpCjB,EAAU,EAAK,EACVa,IAGDA,IAAM5B,EACTY,GAAc,SAAA,EAEdJ,EAAMoB,CAAC,EAET,CAAA,CAAA,EAIDtB,EAAM,SAAW,GAAK,CAACQ,QACtBgB,EAAAA,YAAA,CAAY,MAAOV,EAAAA,OAAO,QAAQ,YACjC,SAAAT,CAAA,CACF,EAEAL,EAAM,IAAK2B,GACVT,EAAAA,KAACU,EAAAA,cAAA,CAEA,YAAW,GAAGxB,CAAc,QAAQuB,EAAK,EAAE,GAE3C,SAAA,CAAAd,EAAAA,IAACgB,EAAAA,QAAA,CACA,SAAAhB,EAAAA,IAACG,EAAAA,cAAA,CAAc,cAAe,EAAG,MAAOF,EAAAA,OAAO,QAAQ,QACrD,SAAAa,EAAK,KAAA,CACP,EACD,EACCpB,EAEAM,EAAAA,IAACiB,EAAAA,gBAAA,CACA,UAAU,aACV,QAASf,EACT,MAAM,QACN,YAAW,GAAGX,CAAc,SAASuB,EAAK,EAAE,GAC5C,SAAWD,GAAQ,CAElB,MAAMJ,GADS,MAAM,QAAQI,CAAG,EAAIA,EAAI,CAAC,EAAIA,IACT,MAChCJ,IAAM3B,EACTY,IAAcoB,EAAK,EAAE,EACXL,IAAM1B,GAChBO,EAASwB,EAAK,EAAE,CAElB,EAEA,eAACI,gBAAA,CAAc,aAAY,eAAeJ,EAAK,KAAK,GACnD,SAAAd,EAAAA,IAACmB,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOlB,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CACD,CAAA,CAAA,EAIDD,EAAAA,IAACkB,EAAAA,cAAA,CACA,YAAW,GAAG3B,CAAc,WAAWuB,EAAK,EAAE,GAC9C,aAAY,UAAUA,EAAK,KAAK,GAChC,QAAS,IAAMxB,EAASwB,EAAK,EAAE,EAE/B,SAAAd,EAAAA,IAACoB,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOnB,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CAAA,CACD,CAAA,EA7CIa,EAAK,EAAA,CAgDX,CAAA,EAEH,CAEF"}
|
|
1
|
+
{"version":3,"file":"SelectableListSection.js","sources":["../../../../../src/components/agent-builder/components/SelectableListSection.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport EditIcon from '@src/assets/icons/edit.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport React, { useState } from 'react';\nimport { Dropdown } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tAddIconButton,\n\tRowActionDivider,\n\tRowActions,\n\tRowMenuButton,\n\tRowText,\n\tSelectableRow,\n\tSideSection,\n\tSideSectionHeader,\n} from '../AgentBuilder.styled';\n\nexport interface SelectableItem {\n\tid: string;\n\tlabel: string;\n}\n\n/** Sentinel value for the \"create new\" entry in the add dropdown. */\nconst CREATE_OPTION_VALUE = '__bik_create_new__';\n\ninterface SelectableListSectionProps {\n\ttitle: string;\n\thelper?: string;\n\titems: SelectableItem[];\n\t/**\n\t * Options shown in the add dropdown. Pass ALL items (not just unselected\n\t * ones) when re-picking an already-added item is allowed (e.g. to insert its\n\t * mention again) — the chip list still shows each item only once.\n\t */\n\taddableOptions: SingleOption[];\n\tonAdd: (id: string) => void;\n\tonRemove: (id: string) => void;\n\tdataTestPrefix: string;\n\temptyText: string;\n\t/**\n\t * Adds a \"create new\" entry at the top of the add dropdown (e.g. \"Create\n\t * sub-agent\"). Selecting it calls `onSelect` instead of `onAdd`.\n\t */\n\tcreateOption?: { label: string; onSelect: () => void };\n\t/**\n\t * When provided, each row's kebab menu gains a \"Configure\" action (above\n\t * \"Delete\"). Omit for tools (Delete only).\n\t */\n\tonConfigure?: (id: string) => void;\n}\n\nexport const SelectableListSection: React.FC<SelectableListSectionProps> = ({\n\ttitle,\n\thelper,\n\titems,\n\taddableOptions,\n\tonAdd,\n\tonRemove,\n\tdataTestPrefix,\n\temptyText,\n\tcreateOption,\n\tonConfigure,\n}) => {\n\tconst [adding, setAdding] = useState(false);\n\tconst showAddButton = addableOptions.length > 0 || !!createOption;\n\t// \"Create new\" is a brand-coloured footer row at the BOTTOM of the dropdown,\n\t// separated from the selectable items by a divider.\n\tconst dropdownOptions: SingleOption[] = createOption\n\t\t? [\n\t\t\t\t...addableOptions,\n\t\t\t\t{\n\t\t\t\t\tlabel: createOption.label,\n\t\t\t\t\tvalue: CREATE_OPTION_VALUE,\n\t\t\t\t\tsearchKey: createOption.label,\n\t\t\t\t\tcustomComponent: (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tcolor: COLORS.content.brand,\n\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\tfontSize: 14,\n\t\t\t\t\t\t\t\tfontWeight: 600,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{createOption.label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t),\n\t\t\t\t},\n\t\t ]\n\t\t: addableOptions;\n\n\treturn (\n\t\t<SideSection>\n\t\t\t<SideSectionHeader>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>{title}</TitleSmall>\n\t\t\t\t{showAddButton && (\n\t\t\t\t\t<AddIconButton\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-add`}\n\t\t\t\t\t\tonClick={() => setAdding((v) => !v)}\n\t\t\t\t\t\taria-label={`Add ${title}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PlusIcon width={20} height={20} color={COLORS.content.brand} />\n\t\t\t\t\t</AddIconButton>\n\t\t\t\t)}\n\t\t\t</SideSectionHeader>\n\n\t\t\t{helper && (\n\t\t\t\t<BodyCaption color={COLORS.content.secondary}>{helper}</BodyCaption>\n\t\t\t)}\n\n\t\t\t{adding && dropdownOptions.length > 0 && (\n\t\t\t\t<Dropdown\n\t\t\t\t\tdata-test={`${dataTestPrefix}-dropdown`}\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\tisSearchable\n\t\t\t\t\tplaceHolder={`Select ${title.toLowerCase()}`}\n\t\t\t\t\toptions={dropdownOptions}\n\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\tconst single = Array.isArray(opt) ? opt[0] : opt;\n\t\t\t\t\t\tconst v = (single as SingleOption)?.value;\n\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\tif (!v) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (v === CREATE_OPTION_VALUE) {\n\t\t\t\t\t\t\tcreateOption?.onSelect();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonAdd(v);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{items.length === 0 && !adding ? (\n\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t{emptyText}\n\t\t\t\t</BodyCaption>\n\t\t\t) : (\n\t\t\t\titems.map((item) => (\n\t\t\t\t\t<SelectableRow\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-row-${item.id}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<RowText>\n\t\t\t\t\t\t\t<BodySecondary numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</RowText>\n\t\t\t\t\t\t<RowActions>\n\t\t\t\t\t\t\t{onConfigure && (\n\t\t\t\t\t\t\t\t// Configurable rows (sub-agents) get an always-visible edit icon.\n\t\t\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-edit-${item.id}`}\n\t\t\t\t\t\t\t\t\taria-label={`Edit ${item.label}`}\n\t\t\t\t\t\t\t\t\tonClick={() => onConfigure(item.id)}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<EditIcon\n\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{onConfigure && <RowActionDivider aria-hidden />}\n\t\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-${item.id}`}\n\t\t\t\t\t\t\t\taria-label={`Delete ${item.label}`}\n\t\t\t\t\t\t\t\tonClick={() => onRemove(item.id)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t</RowActions>\n\t\t\t\t\t</SelectableRow>\n\t\t\t\t))\n\t\t\t)}\n\t\t</SideSection>\n\t);\n};\n"],"names":["CREATE_OPTION_VALUE","SelectableListSection","title","helper","items","addableOptions","onAdd","onRemove","dataTestPrefix","emptyText","createOption","onConfigure","adding","setAdding","useState","showAddButton","dropdownOptions","jsx","COLORS","SideSection","jsxs","SideSectionHeader","TitleSmall","AddIconButton","v","PlusIcon","BodyCaption","Dropdown","opt","item","SelectableRow","RowText","BodySecondary","RowActions","RowMenuButton","EditIcon","RowActionDivider","DeleteIcon"],"mappings":"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"}
|
|
@@ -110,6 +110,12 @@ export declare const RowText: import('styled-components').StyledComponent<"div",
|
|
|
110
110
|
export declare const RowRemoveButton: import('styled-components').StyledComponent<"button", any, {
|
|
111
111
|
className: "bik-row-remove-button";
|
|
112
112
|
}, "className">;
|
|
113
|
+
export declare const RowActions: import('styled-components').StyledComponent<"div", any, {
|
|
114
|
+
className: "bik-row-actions";
|
|
115
|
+
}, "className">;
|
|
116
|
+
export declare const RowActionDivider: import('styled-components').StyledComponent<"span", any, {
|
|
117
|
+
className: "bik-row-action-divider";
|
|
118
|
+
}, "className">;
|
|
113
119
|
export declare const RowMenuButton: import('styled-components').StyledComponent<"button", any, {
|
|
114
120
|
className: "bik-row-menu-button";
|
|
115
121
|
}, "className">;
|
|
@@ -110,7 +110,7 @@ const s = e.div.attrs({ className: "bik-builder-root" })`
|
|
|
110
110
|
border-left: 1px dashed #e0e0e0;
|
|
111
111
|
pointer-events: none;
|
|
112
112
|
}
|
|
113
|
-
`,
|
|
113
|
+
`, k = e.div.attrs({ className: "bik-step-badge" })`
|
|
114
114
|
width: 20px;
|
|
115
115
|
height: 20px;
|
|
116
116
|
flex-shrink: 0;
|
|
@@ -123,7 +123,7 @@ const s = e.div.attrs({ className: "bik-builder-root" })`
|
|
|
123
123
|
font-weight: 600;
|
|
124
124
|
background: ${(a) => a.state === "complete" ? t.content.brand : a.state === "active" ? t.background.brandTint : "#F0F0F0"};
|
|
125
125
|
color: ${(a) => a.state === "complete" ? t.content.primaryInverse : a.state === "active" ? t.content.brand : t.content.placeholder};
|
|
126
|
-
`,
|
|
126
|
+
`, h = e.div.attrs({
|
|
127
127
|
className: "bik-section-header-wrap"
|
|
128
128
|
})`
|
|
129
129
|
display: flex;
|
|
@@ -141,7 +141,7 @@ const s = e.div.attrs({ className: "bik-builder-root" })`
|
|
|
141
141
|
display: flex;
|
|
142
142
|
align-items: center;
|
|
143
143
|
justify-content: space-between;
|
|
144
|
-
`,
|
|
144
|
+
`, w = e.div.attrs({
|
|
145
145
|
className: "bik-ai-text-area-shell"
|
|
146
146
|
})`
|
|
147
147
|
display: flex;
|
|
@@ -153,7 +153,7 @@ const s = e.div.attrs({ className: "bik-builder-root" })`
|
|
|
153
153
|
gap: 8px;
|
|
154
154
|
min-height: ${(a) => a.minHeight ?? "120px"};
|
|
155
155
|
background: ${t.surface.standard};
|
|
156
|
-
`,
|
|
156
|
+
`, N = e.textarea.attrs({
|
|
157
157
|
className: "bik-ai-text-area-input"
|
|
158
158
|
})`
|
|
159
159
|
flex: 1;
|
|
@@ -198,7 +198,7 @@ const s = e.div.attrs({ className: "bik-builder-root" })`
|
|
|
198
198
|
flex-wrap: wrap;
|
|
199
199
|
align-items: center;
|
|
200
200
|
gap: 8px;
|
|
201
|
-
`,
|
|
201
|
+
`, R = e.div.attrs({ className: "bik-intent-chip" })`
|
|
202
202
|
display: inline-flex;
|
|
203
203
|
align-items: center;
|
|
204
204
|
gap: 6px;
|
|
@@ -206,7 +206,7 @@ const s = e.div.attrs({ className: "bik-builder-root" })`
|
|
|
206
206
|
border: 1px solid ${t.stroke.primary};
|
|
207
207
|
border-radius: 4px;
|
|
208
208
|
background: ${t.surface.standard};
|
|
209
|
-
`,
|
|
209
|
+
`, j = e.button.attrs({
|
|
210
210
|
className: "bik-chip-close-button"
|
|
211
211
|
})`
|
|
212
212
|
display: flex;
|
|
@@ -216,7 +216,7 @@ const s = e.div.attrs({ className: "bik-builder-root" })`
|
|
|
216
216
|
background: transparent;
|
|
217
217
|
padding: 0;
|
|
218
218
|
cursor: pointer;
|
|
219
|
-
`,
|
|
219
|
+
`, C = e.button.attrs({
|
|
220
220
|
className: "bik-add-chip-button"
|
|
221
221
|
})`
|
|
222
222
|
display: inline-flex;
|
|
@@ -293,7 +293,19 @@ e.button.attrs({
|
|
|
293
293
|
padding: 0;
|
|
294
294
|
cursor: pointer;
|
|
295
295
|
`;
|
|
296
|
-
const
|
|
296
|
+
const D = e.div.attrs({ className: "bik-row-actions" })`
|
|
297
|
+
display: flex;
|
|
298
|
+
align-items: center;
|
|
299
|
+
gap: 4px;
|
|
300
|
+
flex-shrink: 0;
|
|
301
|
+
`, O = e.span.attrs({
|
|
302
|
+
className: "bik-row-action-divider"
|
|
303
|
+
})`
|
|
304
|
+
width: 1px;
|
|
305
|
+
align-self: stretch;
|
|
306
|
+
margin: 4px 0;
|
|
307
|
+
background: ${t.stroke.primary};
|
|
308
|
+
`, W = e.button.attrs({
|
|
297
309
|
className: "bik-row-menu-button"
|
|
298
310
|
})`
|
|
299
311
|
display: flex;
|
|
@@ -310,32 +322,32 @@ const O = e.button.attrs({
|
|
|
310
322
|
&:hover {
|
|
311
323
|
background: ${t.surface.subdued};
|
|
312
324
|
}
|
|
313
|
-
`,
|
|
325
|
+
`, G = e.div.attrs({ className: "bik-modal-body" })`
|
|
314
326
|
padding: 24px;
|
|
315
327
|
display: flex;
|
|
316
328
|
flex-direction: column;
|
|
317
329
|
align-items: center;
|
|
318
330
|
gap: 16px;
|
|
319
331
|
text-align: center;
|
|
320
|
-
`,
|
|
332
|
+
`, q = e.div.attrs({ className: "bik-modal-icon" })`
|
|
321
333
|
display: flex;
|
|
322
334
|
align-items: center;
|
|
323
335
|
justify-content: center;
|
|
324
336
|
margin-bottom: 4px;
|
|
325
|
-
`,
|
|
337
|
+
`, E = e.div.attrs({
|
|
326
338
|
className: "bik-modal-actions"
|
|
327
339
|
})`
|
|
328
340
|
display: flex;
|
|
329
341
|
gap: 12px;
|
|
330
342
|
width: 100%;
|
|
331
|
-
`,
|
|
343
|
+
`, J = e.div.attrs({
|
|
332
344
|
className: "bik-subagent-scrim"
|
|
333
345
|
})`
|
|
334
346
|
position: fixed;
|
|
335
347
|
inset: 0;
|
|
336
348
|
background: rgba(0, 0, 0, 0.32);
|
|
337
349
|
z-index: 1000;
|
|
338
|
-
`,
|
|
350
|
+
`, K = e.div.attrs({
|
|
339
351
|
className: "bik-subagent-panel"
|
|
340
352
|
})`
|
|
341
353
|
position: fixed;
|
|
@@ -350,7 +362,7 @@ const O = e.button.attrs({
|
|
|
350
362
|
box-shadow: -8px 0 24px rgba(0, 0, 0, 0.12);
|
|
351
363
|
z-index: 1001;
|
|
352
364
|
box-sizing: border-box;
|
|
353
|
-
`,
|
|
365
|
+
`, Q = e.div.attrs({
|
|
354
366
|
className: "bik-subagent-panel-header"
|
|
355
367
|
})`
|
|
356
368
|
display: flex;
|
|
@@ -360,14 +372,14 @@ const O = e.button.attrs({
|
|
|
360
372
|
padding: 16px;
|
|
361
373
|
border-bottom: 1px solid ${t.stroke.primary};
|
|
362
374
|
flex-shrink: 0;
|
|
363
|
-
`,
|
|
375
|
+
`, U = e.div.attrs({
|
|
364
376
|
className: "bik-subagent-panel-header-text"
|
|
365
377
|
})`
|
|
366
378
|
display: flex;
|
|
367
379
|
flex-direction: column;
|
|
368
380
|
gap: 4px;
|
|
369
381
|
min-width: 0;
|
|
370
|
-
`,
|
|
382
|
+
`, V = e.div.attrs({
|
|
371
383
|
className: "bik-subagent-panel-body"
|
|
372
384
|
})`
|
|
373
385
|
flex: 1;
|
|
@@ -377,7 +389,7 @@ const O = e.button.attrs({
|
|
|
377
389
|
display: flex;
|
|
378
390
|
flex-direction: column;
|
|
379
391
|
gap: 20px;
|
|
380
|
-
`,
|
|
392
|
+
`, X = e.div.attrs({
|
|
381
393
|
className: "bik-subagent-panel-footer"
|
|
382
394
|
})`
|
|
383
395
|
display: flex;
|
|
@@ -387,7 +399,7 @@ const O = e.button.attrs({
|
|
|
387
399
|
min-height: 48px;
|
|
388
400
|
border-top: 1px solid ${t.stroke.primary};
|
|
389
401
|
flex-shrink: 0;
|
|
390
|
-
`,
|
|
402
|
+
`, Y = e.button.attrs({
|
|
391
403
|
className: "bik-subagent-close"
|
|
392
404
|
})`
|
|
393
405
|
display: flex;
|
|
@@ -414,14 +426,14 @@ e.div.attrs({
|
|
|
414
426
|
gap: 8px;
|
|
415
427
|
`;
|
|
416
428
|
export {
|
|
417
|
-
|
|
429
|
+
C as AddChipButton,
|
|
418
430
|
M as AddIconButton,
|
|
419
|
-
|
|
420
|
-
|
|
431
|
+
N as AiTextAreaInput,
|
|
432
|
+
w as AiTextAreaShell,
|
|
421
433
|
d as BackButton,
|
|
422
434
|
s as BuilderRoot,
|
|
423
435
|
$ as CardRow,
|
|
424
|
-
|
|
436
|
+
j as ChipCloseButton,
|
|
425
437
|
B as ChipWrap,
|
|
426
438
|
p as Content,
|
|
427
439
|
x as ContentCard,
|
|
@@ -430,33 +442,35 @@ export {
|
|
|
430
442
|
b as Footer,
|
|
431
443
|
m as FooterActions,
|
|
432
444
|
g as FooterHint,
|
|
433
|
-
|
|
445
|
+
R as IntentChip,
|
|
434
446
|
l as Main,
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
447
|
+
E as ModalActions,
|
|
448
|
+
G as ModalBody,
|
|
449
|
+
q as ModalIcon,
|
|
438
450
|
S as RadioCard,
|
|
439
451
|
A as RadioCardText,
|
|
440
452
|
c as Rail,
|
|
441
453
|
f as RailItem,
|
|
442
454
|
u as RailList,
|
|
443
|
-
O as
|
|
455
|
+
O as RowActionDivider,
|
|
456
|
+
D as RowActions,
|
|
457
|
+
W as RowMenuButton,
|
|
444
458
|
L as RowText,
|
|
445
|
-
|
|
459
|
+
h as SectionHeaderWrap,
|
|
446
460
|
P as SelectableRow,
|
|
447
461
|
z as SideSection,
|
|
448
462
|
H as SideSectionHeader,
|
|
449
463
|
F as Step3Grid,
|
|
450
464
|
I as Step3Main,
|
|
451
465
|
T as Step3Side,
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
466
|
+
k as StepBadge,
|
|
467
|
+
Y as SubAgentCloseButton,
|
|
468
|
+
K as SubAgentPanel,
|
|
469
|
+
V as SubAgentPanelBody,
|
|
470
|
+
X as SubAgentPanelFooter,
|
|
471
|
+
Q as SubAgentPanelHeader,
|
|
472
|
+
U as SubAgentPanelHeaderText,
|
|
473
|
+
J as SubAgentScrim,
|
|
460
474
|
r as TopBar,
|
|
461
475
|
o as TopBarSide
|
|
462
476
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AgentBuilder.styled.js","sources":["../../../../src/components/agent-builder/AgentBuilder.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const BuilderRoot = styled.div.attrs({ className: 'bik-builder-root' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n\twidth: 100%;\n\tmin-height: 0;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const TopBar = styled.div.attrs({ className: 'bik-top-bar' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\theight: 56px;\n\tpadding: 12px 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const TopBarSide = styled.div.attrs({ className: 'bik-top-bar-side' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n`;\n\nexport const BackButton = styled.button.attrs({ className: 'bik-back-button' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 28px;\n\theight: 28px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\nexport const Main = styled.div.attrs({ className: 'bik-main' })`\n\tdisplay: flex;\n\tflex: 1;\n\tmin-height: 0;\n`;\n\nexport const Rail = styled.div.attrs({ className: 'bik-rail' })`\n\twidth: 234px;\n\tflex-shrink: 0;\n\tborder-right: 1px solid ${COLORS.stroke.primary};\n\tpadding: 16px;\n\toverflow-y: auto;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const Content = styled.div.attrs({ className: 'bik-content' })`\n\tflex: 1;\n\tmin-width: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ContentCard = styled.div.attrs({ className: 'bik-content-card' })`\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tpadding: 24px;\n\tmin-height: 100%;\n\tbox-sizing: border-box;\n`;\n\nexport const Footer = styled.div.attrs({ className: 'bik-footer' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tmin-height: 56px;\n\tpadding: 12px 16px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const FooterHint = styled.div.attrs({ className: 'bik-footer-hint' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 6px;\n`;\n\nexport const FooterActions = styled.div.attrs({\n\tclassName: 'bik-footer-actions',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n\n// ── Step rail items ─────────────────────────────────────────────────────────\n\nexport const RailList = styled.div.attrs({ className: 'bik-rail-list' })`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const RailItem = styled.button.attrs({ className: 'bik-rail-item' })`\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 8px;\n\t/* Bottom padding leaves room for the connector down to the next badge. */\n\tpadding: 0 0 24px;\n\tborder: none;\n\tbackground: transparent;\n\tcursor: pointer;\n\ttext-align: left;\n\twidth: 100%;\n\n\t&:last-child {\n\t\tpadding-bottom: 0;\n\t}\n\n\t&:disabled {\n\t\tcursor: default;\n\t}\n\n\t/* Dashed connector line between consecutive step badges (centered on the badge). */\n\t&:not(:last-child)::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: 9px;\n\t\ttop: 20px;\n\t\twidth: 0;\n\t\theight: 24px;\n\t\tborder-left: 1px dashed #e0e0e0;\n\t\tpointer-events: none;\n\t}\n`;\n\nexport const StepBadge = styled.div.attrs({ className: 'bik-step-badge' })<{\n\tstate: 'active' | 'complete' | 'inactive';\n}>`\n\twidth: 20px;\n\theight: 20px;\n\tflex-shrink: 0;\n\tborder-radius: 50%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tbackground: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.content.brand\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.background.brandTint\n\t\t\t: '#F0F0F0'};\n\tcolor: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.content.primaryInverse\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.content.brand\n\t\t\t: COLORS.content.placeholder};\n`;\n\n// ── Shared step pieces ──────────────────────────────────────────────────────\n\nexport const SectionHeaderWrap = styled.div.attrs({\n\tclassName: 'bik-section-header-wrap',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmargin-bottom: 20px;\n`;\n\nexport const FieldBlock = styled.div.attrs({ className: 'bik-field-block' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n\tmargin-bottom: 20px;\n`;\n\nexport const FieldLabelRow = styled.div.attrs({\n\tclassName: 'bik-field-label-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n`;\n\n// ── Labelled text area ──────────────────────────────────────────────────────\n\nexport const AiTextAreaShell = styled.div.attrs({\n\tclassName: 'bik-ai-text-area-shell',\n})<{\n\tfocused?: boolean;\n\tminHeight?: string;\n}>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tborder: 1px solid\n\t\t${(p) => (p.focused ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tborder-radius: 4px;\n\tpadding: 8px 12px;\n\tgap: 8px;\n\tmin-height: ${(p) => p.minHeight ?? '120px'};\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const AiTextAreaInput = styled.textarea.attrs({\n\tclassName: 'bik-ai-text-area-input',\n})`\n\tflex: 1;\n\tborder: none;\n\toutline: none;\n\tresize: none;\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tline-height: 20px;\n\tcolor: ${COLORS.content.primary};\n\tbackground: transparent;\n\tmin-height: 60px;\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n`;\n\n// ── Radio card (Step 2 / Step 4 option cards) ───────────────────────────────\n\nexport const CardRow = styled.div.attrs({ className: 'bik-card-row' })`\n\tdisplay: flex;\n\tgap: 12px;\n\tmargin-bottom: 16px;\n`;\n\nexport const RadioCard = styled.button.attrs({ className: 'bik-radio-card' })<{\n\tselected?: boolean;\n}>`\n\tflex: 1;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 12px;\n\tpadding: 16px;\n\tborder: 1px solid\n\t\t${(p) => (p.selected ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tbackground: ${(p) =>\n\t\tp.selected ? COLORS.background.brandLight : COLORS.surface.standard};\n\tborder-radius: 8px;\n\tcursor: pointer;\n\ttext-align: left;\n\twidth: 100%;\n`;\n\nexport const RadioCardText = styled.div.attrs({\n\tclassName: 'bik-radio-card-text',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n`;\n\n// ── Intent chips (Step 2) ───────────────────────────────────────────────────\n\nexport const ChipWrap = styled.div.attrs({ className: 'bik-chip-wrap' })`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 8px;\n`;\n\nexport const IntentChip = styled.div.attrs({ className: 'bik-intent-chip' })`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 4px 8px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ChipCloseButton = styled.button.attrs({\n\tclassName: 'bik-chip-close-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n`;\n\nexport const AddChipButton = styled.button.attrs({\n\tclassName: 'bik-add-chip-button',\n})`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 4px 8px;\n\tborder: 1px dashed ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: transparent;\n\tcursor: pointer;\n`;\n\n// ── Step 3 two-column layout + tool / sub-agent rows ────────────────────────\n\nexport const Step3Grid = styled.div.attrs({ className: 'bik-step3-grid' })`\n\tdisplay: grid;\n\tgrid-template-columns: minmax(0, 1fr) 300px;\n\tgap: 24px;\n\n\t@media (max-width: 1100px) {\n\t\tgrid-template-columns: 1fr;\n\t}\n`;\n\nexport const Step3Main = styled.div.attrs({ className: 'bik-step3-main' })`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const Step3Side = styled.div.attrs({ className: 'bik-step3-side' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 24px;\n`;\n\nexport const SideSection = styled.div.attrs({ className: 'bik-side-section' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\nexport const SideSectionHeader = styled.div.attrs({\n\tclassName: 'bik-side-section-header',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n`;\n\nexport const AddIconButton = styled.button.attrs({\n\tclassName: 'bik-add-icon-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\nexport const SelectableRow = styled.div.attrs({\n\tclassName: 'bik-selectable-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\n\nexport const RowText = styled.div.attrs({ className: 'bik-row-text' })`\n\tflex: 1;\n\tmin-width: 0;\n`;\n\nexport const RowRemoveButton = styled.button.attrs({\n\tclassName: 'bik-row-remove-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n`;\n\n// ── Row kebab (⋮) trigger — popover/menu come from the shared DropdownPopover ──\n\nexport const RowMenuButton = styled.button.attrs({\n\tclassName: 'bik-row-menu-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n// ── Go-live modal ───────────────────────────────────────────────────────────\n\nexport const ModalBody = styled.div.attrs({ className: 'bik-modal-body' })`\n\tpadding: 24px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tgap: 16px;\n\ttext-align: center;\n`;\n\nexport const ModalIcon = styled.div.attrs({ className: 'bik-modal-icon' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmargin-bottom: 4px;\n`;\n\nexport const ModalActions = styled.div.attrs({\n\tclassName: 'bik-modal-actions',\n})`\n\tdisplay: flex;\n\tgap: 12px;\n\twidth: 100%;\n`;\n\n// ── Create sub-agent drawer ─────────────────────────────────────────────────\n\nexport const SubAgentScrim = styled.div.attrs({\n\tclassName: 'bik-subagent-scrim',\n})`\n\tposition: fixed;\n\tinset: 0;\n\tbackground: rgba(0, 0, 0, 0.32);\n\tz-index: 1000;\n`;\n\nexport const SubAgentPanel = styled.div.attrs({\n\tclassName: 'bik-subagent-panel',\n})`\n\tposition: fixed;\n\ttop: 0;\n\tright: 0;\n\theight: 100%;\n\twidth: 421px;\n\tmax-width: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tbackground: ${COLORS.surface.standard};\n\tbox-shadow: -8px 0 24px rgba(0, 0, 0, 0.12);\n\tz-index: 1001;\n\tbox-sizing: border-box;\n`;\n\nexport const SubAgentPanelHeader = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-header',\n})`\n\tdisplay: flex;\n\talign-items: flex-start;\n\tjustify-content: space-between;\n\tgap: 12px;\n\tpadding: 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const SubAgentPanelHeaderText = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-header-text',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmin-width: 0;\n`;\n\nexport const SubAgentPanelBody = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-body',\n})`\n\tflex: 1;\n\tmin-height: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 20px;\n`;\n\nexport const SubAgentPanelFooter = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-footer',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tmin-height: 48px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const SubAgentCloseButton = styled.button.attrs({\n\tclassName: 'bik-subagent-close',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\tflex-shrink: 0;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n/** Inline action row inside a rich field (e.g. \"Improve with AI\"). */\nexport const FieldActionRow = styled.div.attrs({\n\tclassName: 'bik-field-action-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n"],"names":["BuilderRoot","styled","COLORS","TopBar","TopBarSide","BackButton","Main","Rail","Content","ContentCard","Footer","FooterHint","FooterActions","RailList","RailItem","StepBadge","p","SectionHeaderWrap","FieldBlock","FieldLabelRow","AiTextAreaShell","AiTextAreaInput","CardRow","RadioCard","RadioCardText","ChipWrap","IntentChip","ChipCloseButton","AddChipButton","Step3Grid","Step3Main","Step3Side","SideSection","SideSectionHeader","AddIconButton","SelectableRow","RowText","RowMenuButton","ModalBody","ModalIcon","ModalActions","SubAgentScrim","SubAgentPanel","SubAgentPanelHeader","SubAgentPanelHeaderText","SubAgentPanelBody","SubAgentPanelFooter","SubAgentCloseButton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AgentBuilder.styled.js","sources":["../../../../src/components/agent-builder/AgentBuilder.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const BuilderRoot = styled.div.attrs({ className: 'bik-builder-root' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n\twidth: 100%;\n\tmin-height: 0;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const TopBar = styled.div.attrs({ className: 'bik-top-bar' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\theight: 56px;\n\tpadding: 12px 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const TopBarSide = styled.div.attrs({ className: 'bik-top-bar-side' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n`;\n\nexport const BackButton = styled.button.attrs({ className: 'bik-back-button' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 28px;\n\theight: 28px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\nexport const Main = styled.div.attrs({ className: 'bik-main' })`\n\tdisplay: flex;\n\tflex: 1;\n\tmin-height: 0;\n`;\n\nexport const Rail = styled.div.attrs({ className: 'bik-rail' })`\n\twidth: 234px;\n\tflex-shrink: 0;\n\tborder-right: 1px solid ${COLORS.stroke.primary};\n\tpadding: 16px;\n\toverflow-y: auto;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const Content = styled.div.attrs({ className: 'bik-content' })`\n\tflex: 1;\n\tmin-width: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ContentCard = styled.div.attrs({ className: 'bik-content-card' })`\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tpadding: 24px;\n\tmin-height: 100%;\n\tbox-sizing: border-box;\n`;\n\nexport const Footer = styled.div.attrs({ className: 'bik-footer' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tmin-height: 56px;\n\tpadding: 12px 16px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const FooterHint = styled.div.attrs({ className: 'bik-footer-hint' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 6px;\n`;\n\nexport const FooterActions = styled.div.attrs({\n\tclassName: 'bik-footer-actions',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n\n// ── Step rail items ─────────────────────────────────────────────────────────\n\nexport const RailList = styled.div.attrs({ className: 'bik-rail-list' })`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const RailItem = styled.button.attrs({ className: 'bik-rail-item' })`\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 8px;\n\t/* Bottom padding leaves room for the connector down to the next badge. */\n\tpadding: 0 0 24px;\n\tborder: none;\n\tbackground: transparent;\n\tcursor: pointer;\n\ttext-align: left;\n\twidth: 100%;\n\n\t&:last-child {\n\t\tpadding-bottom: 0;\n\t}\n\n\t&:disabled {\n\t\tcursor: default;\n\t}\n\n\t/* Dashed connector line between consecutive step badges (centered on the badge). */\n\t&:not(:last-child)::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: 9px;\n\t\ttop: 20px;\n\t\twidth: 0;\n\t\theight: 24px;\n\t\tborder-left: 1px dashed #e0e0e0;\n\t\tpointer-events: none;\n\t}\n`;\n\nexport const StepBadge = styled.div.attrs({ className: 'bik-step-badge' })<{\n\tstate: 'active' | 'complete' | 'inactive';\n}>`\n\twidth: 20px;\n\theight: 20px;\n\tflex-shrink: 0;\n\tborder-radius: 50%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tbackground: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.content.brand\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.background.brandTint\n\t\t\t: '#F0F0F0'};\n\tcolor: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.content.primaryInverse\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.content.brand\n\t\t\t: COLORS.content.placeholder};\n`;\n\n// ── Shared step pieces ──────────────────────────────────────────────────────\n\nexport const SectionHeaderWrap = styled.div.attrs({\n\tclassName: 'bik-section-header-wrap',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmargin-bottom: 20px;\n`;\n\nexport const FieldBlock = styled.div.attrs({ className: 'bik-field-block' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n\tmargin-bottom: 20px;\n`;\n\nexport const FieldLabelRow = styled.div.attrs({\n\tclassName: 'bik-field-label-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n`;\n\n// ── Labelled text area ──────────────────────────────────────────────────────\n\nexport const AiTextAreaShell = styled.div.attrs({\n\tclassName: 'bik-ai-text-area-shell',\n})<{\n\tfocused?: boolean;\n\tminHeight?: string;\n}>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tborder: 1px solid\n\t\t${(p) => (p.focused ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tborder-radius: 4px;\n\tpadding: 8px 12px;\n\tgap: 8px;\n\tmin-height: ${(p) => p.minHeight ?? '120px'};\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const AiTextAreaInput = styled.textarea.attrs({\n\tclassName: 'bik-ai-text-area-input',\n})`\n\tflex: 1;\n\tborder: none;\n\toutline: none;\n\tresize: none;\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tline-height: 20px;\n\tcolor: ${COLORS.content.primary};\n\tbackground: transparent;\n\tmin-height: 60px;\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n`;\n\n// ── Radio card (Step 2 / Step 4 option cards) ───────────────────────────────\n\nexport const CardRow = styled.div.attrs({ className: 'bik-card-row' })`\n\tdisplay: flex;\n\tgap: 12px;\n\tmargin-bottom: 16px;\n`;\n\nexport const RadioCard = styled.button.attrs({ className: 'bik-radio-card' })<{\n\tselected?: boolean;\n}>`\n\tflex: 1;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 12px;\n\tpadding: 16px;\n\tborder: 1px solid\n\t\t${(p) => (p.selected ? COLORS.stroke.brand : COLORS.stroke.primary)};\n\tbackground: ${(p) =>\n\t\tp.selected ? COLORS.background.brandLight : COLORS.surface.standard};\n\tborder-radius: 8px;\n\tcursor: pointer;\n\ttext-align: left;\n\twidth: 100%;\n`;\n\nexport const RadioCardText = styled.div.attrs({\n\tclassName: 'bik-radio-card-text',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n`;\n\n// ── Intent chips (Step 2) ───────────────────────────────────────────────────\n\nexport const ChipWrap = styled.div.attrs({ className: 'bik-chip-wrap' })`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 8px;\n`;\n\nexport const IntentChip = styled.div.attrs({ className: 'bik-intent-chip' })`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 4px 8px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ChipCloseButton = styled.button.attrs({\n\tclassName: 'bik-chip-close-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n`;\n\nexport const AddChipButton = styled.button.attrs({\n\tclassName: 'bik-add-chip-button',\n})`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 4px 8px;\n\tborder: 1px dashed ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: transparent;\n\tcursor: pointer;\n`;\n\n// ── Step 3 two-column layout + tool / sub-agent rows ────────────────────────\n\nexport const Step3Grid = styled.div.attrs({ className: 'bik-step3-grid' })`\n\tdisplay: grid;\n\tgrid-template-columns: minmax(0, 1fr) 300px;\n\tgap: 24px;\n\n\t@media (max-width: 1100px) {\n\t\tgrid-template-columns: 1fr;\n\t}\n`;\n\nexport const Step3Main = styled.div.attrs({ className: 'bik-step3-main' })`\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\nexport const Step3Side = styled.div.attrs({ className: 'bik-step3-side' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 24px;\n`;\n\nexport const SideSection = styled.div.attrs({ className: 'bik-side-section' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\nexport const SideSectionHeader = styled.div.attrs({\n\tclassName: 'bik-side-section-header',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n`;\n\nexport const AddIconButton = styled.button.attrs({\n\tclassName: 'bik-add-icon-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\nexport const SelectableRow = styled.div.attrs({\n\tclassName: 'bik-selectable-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\n\nexport const RowText = styled.div.attrs({ className: 'bik-row-text' })`\n\tflex: 1;\n\tmin-width: 0;\n`;\n\nexport const RowRemoveButton = styled.button.attrs({\n\tclassName: 'bik-row-remove-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n`;\n\n// ── Per-row actions (always-visible edit / delete icon buttons) ───────────────\n\nexport const RowActions = styled.div.attrs({ className: 'bik-row-actions' })`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\tflex-shrink: 0;\n`;\n\n// Vertical separator between the edit and delete icon buttons.\nexport const RowActionDivider = styled.span.attrs({\n\tclassName: 'bik-row-action-divider',\n})`\n\twidth: 1px;\n\talign-self: stretch;\n\tmargin: 4px 0;\n\tbackground: ${COLORS.stroke.primary};\n`;\n\nexport const RowMenuButton = styled.button.attrs({\n\tclassName: 'bik-row-menu-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n// ── Go-live modal ───────────────────────────────────────────────────────────\n\nexport const ModalBody = styled.div.attrs({ className: 'bik-modal-body' })`\n\tpadding: 24px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tgap: 16px;\n\ttext-align: center;\n`;\n\nexport const ModalIcon = styled.div.attrs({ className: 'bik-modal-icon' })`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmargin-bottom: 4px;\n`;\n\nexport const ModalActions = styled.div.attrs({\n\tclassName: 'bik-modal-actions',\n})`\n\tdisplay: flex;\n\tgap: 12px;\n\twidth: 100%;\n`;\n\n// ── Create sub-agent drawer ─────────────────────────────────────────────────\n\nexport const SubAgentScrim = styled.div.attrs({\n\tclassName: 'bik-subagent-scrim',\n})`\n\tposition: fixed;\n\tinset: 0;\n\tbackground: rgba(0, 0, 0, 0.32);\n\tz-index: 1000;\n`;\n\nexport const SubAgentPanel = styled.div.attrs({\n\tclassName: 'bik-subagent-panel',\n})`\n\tposition: fixed;\n\ttop: 0;\n\tright: 0;\n\theight: 100%;\n\twidth: 421px;\n\tmax-width: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\tbackground: ${COLORS.surface.standard};\n\tbox-shadow: -8px 0 24px rgba(0, 0, 0, 0.12);\n\tz-index: 1001;\n\tbox-sizing: border-box;\n`;\n\nexport const SubAgentPanelHeader = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-header',\n})`\n\tdisplay: flex;\n\talign-items: flex-start;\n\tjustify-content: space-between;\n\tgap: 12px;\n\tpadding: 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const SubAgentPanelHeaderText = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-header-text',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmin-width: 0;\n`;\n\nexport const SubAgentPanelBody = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-body',\n})`\n\tflex: 1;\n\tmin-height: 0;\n\toverflow-y: auto;\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 20px;\n`;\n\nexport const SubAgentPanelFooter = styled.div.attrs({\n\tclassName: 'bik-subagent-panel-footer',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tmin-height: 48px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n\tflex-shrink: 0;\n`;\n\nexport const SubAgentCloseButton = styled.button.attrs({\n\tclassName: 'bik-subagent-close',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 24px;\n\theight: 24px;\n\tborder: none;\n\tbackground: transparent;\n\tpadding: 0;\n\tcursor: pointer;\n\tborder-radius: 4px;\n\tflex-shrink: 0;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n/** Inline action row inside a rich field (e.g. \"Improve with AI\"). */\nexport const FieldActionRow = styled.div.attrs({\n\tclassName: 'bik-field-action-row',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n"],"names":["BuilderRoot","styled","COLORS","TopBar","TopBarSide","BackButton","Main","Rail","Content","ContentCard","Footer","FooterHint","FooterActions","RailList","RailItem","StepBadge","p","SectionHeaderWrap","FieldBlock","FieldLabelRow","AiTextAreaShell","AiTextAreaInput","CardRow","RadioCard","RadioCardText","ChipWrap","IntentChip","ChipCloseButton","AddChipButton","Step3Grid","Step3Main","Step3Side","SideSection","SideSectionHeader","AddIconButton","SelectableRow","RowText","RowActions","RowActionDivider","RowMenuButton","ModalBody","ModalIcon","ModalActions","SubAgentScrim","SubAgentPanel","SubAgentPanelHeader","SubAgentPanelHeaderText","SubAgentPanelBody","SubAgentPanelFooter","SubAgentCloseButton"],"mappings":"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"}
|
|
@@ -1,131 +1,117 @@
|
|
|
1
|
-
import { jsx as o, jsxs as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import { useState as
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
onRemove: _,
|
|
1
|
+
import { jsx as o, jsxs as r } from "react/jsx-runtime";
|
|
2
|
+
import A from "../../../assets/icons/delete.svg.js";
|
|
3
|
+
import v from "../../../assets/icons/edit.svg.js";
|
|
4
|
+
import _ from "../../../assets/icons/plus.svg.js";
|
|
5
|
+
import { useState as R } from "react";
|
|
6
|
+
import { TitleSmall as C, BodyCaption as b, BodySecondary as B } from "../../TypographyStyle.js";
|
|
7
|
+
import { COLORS as l } from "../../../constants/Theme.js";
|
|
8
|
+
import { SideSection as E, SideSectionHeader as L, AddIconButton as k, SelectableRow as D, RowText as I, RowActions as j, RowMenuButton as g, RowActionDivider as z } from "../AgentBuilder.styled.js";
|
|
9
|
+
import { Dropdown as H } from "../../dropdown/Dropdown.js";
|
|
10
|
+
const y = "__bik_create_new__", J = ({
|
|
11
|
+
title: d,
|
|
12
|
+
helper: s,
|
|
13
|
+
items: h,
|
|
14
|
+
addableOptions: c,
|
|
15
|
+
onAdd: p,
|
|
16
|
+
onRemove: u,
|
|
18
17
|
dataTestPrefix: t,
|
|
19
|
-
emptyText:
|
|
20
|
-
createOption:
|
|
21
|
-
onConfigure:
|
|
18
|
+
emptyText: $,
|
|
19
|
+
createOption: n,
|
|
20
|
+
onConfigure: i
|
|
22
21
|
}) => {
|
|
23
|
-
const [
|
|
24
|
-
...
|
|
22
|
+
const [S, m] = R(!1), f = c.length > 0 || !!n, w = n ? [
|
|
23
|
+
...c,
|
|
25
24
|
{
|
|
26
|
-
label:
|
|
25
|
+
label: n.label,
|
|
27
26
|
value: y,
|
|
28
|
-
searchKey:
|
|
27
|
+
searchKey: n.label,
|
|
29
28
|
customComponent: /* @__PURE__ */ o(
|
|
30
29
|
"div",
|
|
31
30
|
{
|
|
32
31
|
style: {
|
|
33
32
|
width: "100%",
|
|
34
33
|
textAlign: "center",
|
|
35
|
-
color:
|
|
34
|
+
color: l.content.brand,
|
|
36
35
|
fontFamily: "Inter",
|
|
37
36
|
fontSize: 14,
|
|
38
37
|
fontWeight: 600
|
|
39
38
|
},
|
|
40
|
-
children:
|
|
39
|
+
children: n.label
|
|
41
40
|
}
|
|
42
41
|
)
|
|
43
42
|
}
|
|
44
|
-
] :
|
|
45
|
-
|
|
46
|
-
{
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
}
|
|
51
|
-
];
|
|
52
|
-
return /* @__PURE__ */ s(V, { children: [
|
|
53
|
-
/* @__PURE__ */ s(W, { children: [
|
|
54
|
-
/* @__PURE__ */ o(U, { color: n.content.primary, children: i }),
|
|
55
|
-
C && /* @__PURE__ */ o(
|
|
56
|
-
j,
|
|
43
|
+
] : c;
|
|
44
|
+
return /* @__PURE__ */ r(E, { children: [
|
|
45
|
+
/* @__PURE__ */ r(L, { children: [
|
|
46
|
+
/* @__PURE__ */ o(C, { color: l.content.primary, children: d }),
|
|
47
|
+
f && /* @__PURE__ */ o(
|
|
48
|
+
k,
|
|
57
49
|
{
|
|
58
50
|
"data-test": `${t}-add`,
|
|
59
|
-
onClick: () =>
|
|
60
|
-
"aria-label": `Add ${
|
|
61
|
-
children: /* @__PURE__ */ o(
|
|
51
|
+
onClick: () => m((e) => !e),
|
|
52
|
+
"aria-label": `Add ${d}`,
|
|
53
|
+
children: /* @__PURE__ */ o(_, { width: 20, height: 20, color: l.content.brand })
|
|
62
54
|
}
|
|
63
55
|
)
|
|
64
56
|
] }),
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
57
|
+
s && /* @__PURE__ */ o(b, { color: l.content.secondary, children: s }),
|
|
58
|
+
S && w.length > 0 && /* @__PURE__ */ o(
|
|
59
|
+
H,
|
|
68
60
|
{
|
|
69
61
|
"data-test": `${t}-dropdown`,
|
|
70
62
|
size: "small",
|
|
71
63
|
width: "100%",
|
|
72
64
|
isSearchable: !0,
|
|
73
|
-
placeHolder: `Select ${
|
|
74
|
-
options:
|
|
65
|
+
placeHolder: `Select ${d.toLowerCase()}`,
|
|
66
|
+
options: w,
|
|
75
67
|
onSelect: (e) => {
|
|
76
|
-
const
|
|
77
|
-
|
|
68
|
+
const a = (Array.isArray(e) ? e[0] : e)?.value;
|
|
69
|
+
m(!1), a && (a === y ? n?.onSelect() : p(a));
|
|
78
70
|
}
|
|
79
71
|
}
|
|
80
72
|
),
|
|
81
|
-
|
|
82
|
-
|
|
73
|
+
h.length === 0 && !S ? /* @__PURE__ */ o(b, { color: l.content.placeholder, children: $ }) : h.map((e) => /* @__PURE__ */ r(
|
|
74
|
+
D,
|
|
83
75
|
{
|
|
84
76
|
"data-test": `${t}-row-${e.id}`,
|
|
85
77
|
children: [
|
|
86
|
-
/* @__PURE__ */ o(
|
|
87
|
-
|
|
88
|
-
//
|
|
78
|
+
/* @__PURE__ */ o(I, { children: /* @__PURE__ */ o(B, { numberOfLines: 1, color: l.content.primary, children: e.label }) }),
|
|
79
|
+
/* @__PURE__ */ r(j, { children: [
|
|
80
|
+
i && // Configurable rows (sub-agents) get an always-visible edit icon.
|
|
89
81
|
/* @__PURE__ */ o(
|
|
90
|
-
|
|
82
|
+
g,
|
|
91
83
|
{
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
const u = (Array.isArray(r) ? r[0] : r)?.value;
|
|
98
|
-
u === A ? a?.(e.id) : u === v && _(e.id);
|
|
99
|
-
},
|
|
100
|
-
children: /* @__PURE__ */ o(f, { "aria-label": `Options for ${e.label}`, children: /* @__PURE__ */ o(
|
|
101
|
-
k,
|
|
84
|
+
"data-test": `${t}-edit-${e.id}`,
|
|
85
|
+
"aria-label": `Edit ${e.label}`,
|
|
86
|
+
onClick: () => i(e.id),
|
|
87
|
+
children: /* @__PURE__ */ o(
|
|
88
|
+
v,
|
|
102
89
|
{
|
|
103
90
|
width: 16,
|
|
104
91
|
height: 16,
|
|
105
|
-
color:
|
|
92
|
+
color: l.content.secondary
|
|
106
93
|
}
|
|
107
|
-
)
|
|
94
|
+
)
|
|
108
95
|
}
|
|
109
|
-
)
|
|
110
|
-
|
|
111
|
-
// Delete-only → direct delete icon, no kebab/popover.
|
|
96
|
+
),
|
|
97
|
+
i && /* @__PURE__ */ o(z, { "aria-hidden": !0 }),
|
|
112
98
|
/* @__PURE__ */ o(
|
|
113
|
-
|
|
99
|
+
g,
|
|
114
100
|
{
|
|
115
101
|
"data-test": `${t}-delete-${e.id}`,
|
|
116
102
|
"aria-label": `Delete ${e.label}`,
|
|
117
|
-
onClick: () =>
|
|
103
|
+
onClick: () => u(e.id),
|
|
118
104
|
children: /* @__PURE__ */ o(
|
|
119
|
-
|
|
105
|
+
A,
|
|
120
106
|
{
|
|
121
107
|
width: 16,
|
|
122
108
|
height: 16,
|
|
123
|
-
color:
|
|
109
|
+
color: l.content.secondary
|
|
124
110
|
}
|
|
125
111
|
)
|
|
126
112
|
}
|
|
127
113
|
)
|
|
128
|
-
)
|
|
114
|
+
] })
|
|
129
115
|
]
|
|
130
116
|
},
|
|
131
117
|
e.id
|
|
@@ -133,6 +119,6 @@ const y = "__bik_create_new__", A = "__bik_configure__", v = "__bik_delete__", X
|
|
|
133
119
|
] });
|
|
134
120
|
};
|
|
135
121
|
export {
|
|
136
|
-
|
|
122
|
+
J as SelectableListSection
|
|
137
123
|
};
|
|
138
124
|
//# sourceMappingURL=SelectableListSection.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectableListSection.js","sources":["../../../../../src/components/agent-builder/components/SelectableListSection.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport VerticalDotsIcon from '@src/assets/icons/vertical_dots.svg';\nimport React, { useState } from 'react';\nimport { Dropdown, DropdownPopover } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tAddIconButton,\n\tRowMenuButton,\n\tRowText,\n\tSelectableRow,\n\tSideSection,\n\tSideSectionHeader,\n} from '../AgentBuilder.styled';\n\nexport interface SelectableItem {\n\tid: string;\n\tlabel: string;\n}\n\n/** Sentinel value for the \"create new\" entry in the add dropdown. */\nconst CREATE_OPTION_VALUE = '__bik_create_new__';\n/** Sentinels for the per-row kebab menu actions. */\nconst ROW_CONFIGURE_VALUE = '__bik_configure__';\nconst ROW_DELETE_VALUE = '__bik_delete__';\n\ninterface SelectableListSectionProps {\n\ttitle: string;\n\thelper?: string;\n\titems: SelectableItem[];\n\t/**\n\t * Options shown in the add dropdown. Pass ALL items (not just unselected\n\t * ones) when re-picking an already-added item is allowed (e.g. to insert its\n\t * mention again) — the chip list still shows each item only once.\n\t */\n\taddableOptions: SingleOption[];\n\tonAdd: (id: string) => void;\n\tonRemove: (id: string) => void;\n\tdataTestPrefix: string;\n\temptyText: string;\n\t/**\n\t * Adds a \"create new\" entry at the top of the add dropdown (e.g. \"Create\n\t * sub-agent\"). Selecting it calls `onSelect` instead of `onAdd`.\n\t */\n\tcreateOption?: { label: string; onSelect: () => void };\n\t/**\n\t * When provided, each row's kebab menu gains a \"Configure\" action (above\n\t * \"Delete\"). Omit for tools (Delete only).\n\t */\n\tonConfigure?: (id: string) => void;\n}\n\nexport const SelectableListSection: React.FC<SelectableListSectionProps> = ({\n\ttitle,\n\thelper,\n\titems,\n\taddableOptions,\n\tonAdd,\n\tonRemove,\n\tdataTestPrefix,\n\temptyText,\n\tcreateOption,\n\tonConfigure,\n}) => {\n\tconst [adding, setAdding] = useState(false);\n\tconst showAddButton = addableOptions.length > 0 || !!createOption;\n\t// \"Create new\" is a brand-coloured footer row at the BOTTOM of the dropdown,\n\t// separated from the selectable items by a divider.\n\tconst dropdownOptions: SingleOption[] = createOption\n\t\t? [\n\t\t\t\t...addableOptions,\n\t\t\t\t{\n\t\t\t\t\tlabel: createOption.label,\n\t\t\t\t\tvalue: CREATE_OPTION_VALUE,\n\t\t\t\t\tsearchKey: createOption.label,\n\t\t\t\t\tcustomComponent: (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tcolor: COLORS.content.brand,\n\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\tfontSize: 14,\n\t\t\t\t\t\t\t\tfontWeight: 600,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{createOption.label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t),\n\t\t\t\t},\n\t\t ]\n\t\t: addableOptions;\n\n\t// Per-row kebab menu: Delete (red) always; Configure above it when allowed.\n\tconst rowMenuOptions: SingleOption[] = [\n\t\t...(onConfigure\n\t\t\t? [{ label: 'Configure', value: ROW_CONFIGURE_VALUE }]\n\t\t\t: []),\n\t\t{\n\t\t\tlabel: 'Delete',\n\t\t\tvalue: ROW_DELETE_VALUE,\n\t\t\tcustomComponent: (\n\t\t\t\t<BodySecondary color={COLORS.content.negative}>Delete</BodySecondary>\n\t\t\t),\n\t\t},\n\t];\n\n\treturn (\n\t\t<SideSection>\n\t\t\t<SideSectionHeader>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>{title}</TitleSmall>\n\t\t\t\t{showAddButton && (\n\t\t\t\t\t<AddIconButton\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-add`}\n\t\t\t\t\t\tonClick={() => setAdding((v) => !v)}\n\t\t\t\t\t\taria-label={`Add ${title}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PlusIcon width={20} height={20} color={COLORS.content.brand} />\n\t\t\t\t\t</AddIconButton>\n\t\t\t\t)}\n\t\t\t</SideSectionHeader>\n\n\t\t\t{helper && (\n\t\t\t\t<BodyCaption color={COLORS.content.secondary}>{helper}</BodyCaption>\n\t\t\t)}\n\n\t\t\t{adding && dropdownOptions.length > 0 && (\n\t\t\t\t<Dropdown\n\t\t\t\t\tdata-test={`${dataTestPrefix}-dropdown`}\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\tisSearchable\n\t\t\t\t\tplaceHolder={`Select ${title.toLowerCase()}`}\n\t\t\t\t\toptions={dropdownOptions}\n\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\tconst single = Array.isArray(opt) ? opt[0] : opt;\n\t\t\t\t\t\tconst v = (single as SingleOption)?.value;\n\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\tif (!v) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (v === CREATE_OPTION_VALUE) {\n\t\t\t\t\t\t\tcreateOption?.onSelect();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonAdd(v);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{items.length === 0 && !adding ? (\n\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t{emptyText}\n\t\t\t\t</BodyCaption>\n\t\t\t) : (\n\t\t\t\titems.map((item) => (\n\t\t\t\t\t<SelectableRow\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-row-${item.id}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<RowText>\n\t\t\t\t\t\t\t<BodySecondary numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</RowText>\n\t\t\t\t\t\t{onConfigure ? (\n\t\t\t\t\t\t\t// Multiple actions (Configure + Delete) → kebab menu.\n\t\t\t\t\t\t\t<DropdownPopover\n\t\t\t\t\t\t\t\tplacement=\"bottom-end\"\n\t\t\t\t\t\t\t\toptions={rowMenuOptions}\n\t\t\t\t\t\t\t\twidth=\"150px\"\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-menu-${item.id}`}\n\t\t\t\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\t\t\t\tconst single = Array.isArray(opt) ? opt[0] : opt;\n\t\t\t\t\t\t\t\t\tconst v = (single as SingleOption)?.value;\n\t\t\t\t\t\t\t\t\tif (v === ROW_CONFIGURE_VALUE) {\n\t\t\t\t\t\t\t\t\t\tonConfigure?.(item.id);\n\t\t\t\t\t\t\t\t\t} else if (v === ROW_DELETE_VALUE) {\n\t\t\t\t\t\t\t\t\t\tonRemove(item.id);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<RowMenuButton aria-label={`Options for ${item.label}`}>\n\t\t\t\t\t\t\t\t\t<VerticalDotsIcon\n\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t\t</DropdownPopover>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t// Delete-only → direct delete icon, no kebab/popover.\n\t\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-${item.id}`}\n\t\t\t\t\t\t\t\taria-label={`Delete ${item.label}`}\n\t\t\t\t\t\t\t\tonClick={() => onRemove(item.id)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</SelectableRow>\n\t\t\t\t))\n\t\t\t)}\n\t\t</SideSection>\n\t);\n};\n"],"names":["CREATE_OPTION_VALUE","ROW_CONFIGURE_VALUE","ROW_DELETE_VALUE","SelectableListSection","title","helper","items","addableOptions","onAdd","onRemove","dataTestPrefix","emptyText","createOption","onConfigure","adding","setAdding","useState","showAddButton","dropdownOptions","jsx","COLORS","rowMenuOptions","BodySecondary","SideSection","jsxs","SideSectionHeader","TitleSmall","AddIconButton","v","PlusIcon","BodyCaption","Dropdown","opt","item","SelectableRow","RowText","DropdownPopover","RowMenuButton","VerticalDotsIcon","DeleteIcon"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelectableListSection.js","sources":["../../../../../src/components/agent-builder/components/SelectableListSection.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport EditIcon from '@src/assets/icons/edit.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport React, { useState } from 'react';\nimport { Dropdown } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tAddIconButton,\n\tRowActionDivider,\n\tRowActions,\n\tRowMenuButton,\n\tRowText,\n\tSelectableRow,\n\tSideSection,\n\tSideSectionHeader,\n} from '../AgentBuilder.styled';\n\nexport interface SelectableItem {\n\tid: string;\n\tlabel: string;\n}\n\n/** Sentinel value for the \"create new\" entry in the add dropdown. */\nconst CREATE_OPTION_VALUE = '__bik_create_new__';\n\ninterface SelectableListSectionProps {\n\ttitle: string;\n\thelper?: string;\n\titems: SelectableItem[];\n\t/**\n\t * Options shown in the add dropdown. Pass ALL items (not just unselected\n\t * ones) when re-picking an already-added item is allowed (e.g. to insert its\n\t * mention again) — the chip list still shows each item only once.\n\t */\n\taddableOptions: SingleOption[];\n\tonAdd: (id: string) => void;\n\tonRemove: (id: string) => void;\n\tdataTestPrefix: string;\n\temptyText: string;\n\t/**\n\t * Adds a \"create new\" entry at the top of the add dropdown (e.g. \"Create\n\t * sub-agent\"). Selecting it calls `onSelect` instead of `onAdd`.\n\t */\n\tcreateOption?: { label: string; onSelect: () => void };\n\t/**\n\t * When provided, each row's kebab menu gains a \"Configure\" action (above\n\t * \"Delete\"). Omit for tools (Delete only).\n\t */\n\tonConfigure?: (id: string) => void;\n}\n\nexport const SelectableListSection: React.FC<SelectableListSectionProps> = ({\n\ttitle,\n\thelper,\n\titems,\n\taddableOptions,\n\tonAdd,\n\tonRemove,\n\tdataTestPrefix,\n\temptyText,\n\tcreateOption,\n\tonConfigure,\n}) => {\n\tconst [adding, setAdding] = useState(false);\n\tconst showAddButton = addableOptions.length > 0 || !!createOption;\n\t// \"Create new\" is a brand-coloured footer row at the BOTTOM of the dropdown,\n\t// separated from the selectable items by a divider.\n\tconst dropdownOptions: SingleOption[] = createOption\n\t\t? [\n\t\t\t\t...addableOptions,\n\t\t\t\t{\n\t\t\t\t\tlabel: createOption.label,\n\t\t\t\t\tvalue: CREATE_OPTION_VALUE,\n\t\t\t\t\tsearchKey: createOption.label,\n\t\t\t\t\tcustomComponent: (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tcolor: COLORS.content.brand,\n\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\tfontSize: 14,\n\t\t\t\t\t\t\t\tfontWeight: 600,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{createOption.label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t),\n\t\t\t\t},\n\t\t ]\n\t\t: addableOptions;\n\n\treturn (\n\t\t<SideSection>\n\t\t\t<SideSectionHeader>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>{title}</TitleSmall>\n\t\t\t\t{showAddButton && (\n\t\t\t\t\t<AddIconButton\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-add`}\n\t\t\t\t\t\tonClick={() => setAdding((v) => !v)}\n\t\t\t\t\t\taria-label={`Add ${title}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PlusIcon width={20} height={20} color={COLORS.content.brand} />\n\t\t\t\t\t</AddIconButton>\n\t\t\t\t)}\n\t\t\t</SideSectionHeader>\n\n\t\t\t{helper && (\n\t\t\t\t<BodyCaption color={COLORS.content.secondary}>{helper}</BodyCaption>\n\t\t\t)}\n\n\t\t\t{adding && dropdownOptions.length > 0 && (\n\t\t\t\t<Dropdown\n\t\t\t\t\tdata-test={`${dataTestPrefix}-dropdown`}\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\tisSearchable\n\t\t\t\t\tplaceHolder={`Select ${title.toLowerCase()}`}\n\t\t\t\t\toptions={dropdownOptions}\n\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\tconst single = Array.isArray(opt) ? opt[0] : opt;\n\t\t\t\t\t\tconst v = (single as SingleOption)?.value;\n\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\tif (!v) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (v === CREATE_OPTION_VALUE) {\n\t\t\t\t\t\t\tcreateOption?.onSelect();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonAdd(v);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{items.length === 0 && !adding ? (\n\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t{emptyText}\n\t\t\t\t</BodyCaption>\n\t\t\t) : (\n\t\t\t\titems.map((item) => (\n\t\t\t\t\t<SelectableRow\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-row-${item.id}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<RowText>\n\t\t\t\t\t\t\t<BodySecondary numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</RowText>\n\t\t\t\t\t\t<RowActions>\n\t\t\t\t\t\t\t{onConfigure && (\n\t\t\t\t\t\t\t\t// Configurable rows (sub-agents) get an always-visible edit icon.\n\t\t\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-edit-${item.id}`}\n\t\t\t\t\t\t\t\t\taria-label={`Edit ${item.label}`}\n\t\t\t\t\t\t\t\t\tonClick={() => onConfigure(item.id)}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<EditIcon\n\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{onConfigure && <RowActionDivider aria-hidden />}\n\t\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-${item.id}`}\n\t\t\t\t\t\t\t\taria-label={`Delete ${item.label}`}\n\t\t\t\t\t\t\t\tonClick={() => onRemove(item.id)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t</RowActions>\n\t\t\t\t\t</SelectableRow>\n\t\t\t\t))\n\t\t\t)}\n\t\t</SideSection>\n\t);\n};\n"],"names":["CREATE_OPTION_VALUE","SelectableListSection","title","helper","items","addableOptions","onAdd","onRemove","dataTestPrefix","emptyText","createOption","onConfigure","adding","setAdding","useState","showAddButton","dropdownOptions","jsx","COLORS","SideSection","jsxs","SideSectionHeader","TitleSmall","AddIconButton","v","PlusIcon","BodyCaption","Dropdown","opt","item","SelectableRow","RowText","BodySecondary","RowActions","RowMenuButton","EditIcon","RowActionDivider","DeleteIcon"],"mappings":"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"}
|