@bikdotai/bik-component-library 0.0.836 → 0.0.837-beta.0

package/dist/esm/components/agent-builder/AgentBuilder.styled.js

@@ -1,6 +1,6 @@
-import e, { css as i } from "styled-components";
-import { COLORS as t } from "../../constants/Theme.js";
-const s = i`
+import e, { css as r } from "styled-components";
+import { COLORS as t, BASE_COLORS as i } from "../../constants/Theme.js";
+const s = r`
 	display: flex;
 	align-items: center;
 	justify-content: center;
@@ -15,14 +15,20 @@ const s = i`
 	&:hover {
 		background: ${t.surface.subdued};
 	}
-`, n = e.div.attrs({ className: "bik-builder-root" })`
+
+	&:disabled {
+		cursor: not-allowed;
+		opacity: 0.5;
+		background: transparent;
+	}
+`, d = e.div.attrs({ className: "bik-builder-root" })`
 	display: flex;
 	flex-direction: column;
 	height: 100%;
 	width: 100%;
 	min-height: 0;
 	background: ${t.surface.standard};
-`, d = e.div.attrs({ className: "bik-top-bar" })`
+`, l = e.div.attrs({ className: "bik-top-bar" })`
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
@@ -30,11 +36,11 @@ const s = i`
 	padding: 12px 16px;
 	border-bottom: 1px solid ${t.stroke.primary};
 	flex-shrink: 0;
-`, l = e.div.attrs({ className: "bik-top-bar-side" })`
+`, c = e.div.attrs({ className: "bik-top-bar-side" })`
 	display: flex;
 	align-items: center;
 	gap: 8px;
-`, c = e.button.attrs({ className: "bik-back-button" })`
+`, p = e.button.attrs({ className: "bik-back-button" })`
 	display: flex;
 	align-items: center;
 	justify-content: center;
@@ -49,18 +55,18 @@ const s = i`
 	&:hover {
 		background: ${t.surface.subdued};
 	}
-`, p = e.div.attrs({ className: "bik-main" })`
+`, x = e.div.attrs({ className: "bik-main" })`
 	display: flex;
 	flex: 1;
 	min-height: 0;
-`, x = e.div.attrs({ className: "bik-rail" })`
+`, b = e.div.attrs({ className: "bik-rail" })`
 	width: 234px;
 	flex-shrink: 0;
 	border-right: 1px solid ${t.stroke.primary};
 	padding: 16px;
 	overflow-y: auto;
 	background: ${t.surface.standard};
-`, b = e.div.attrs({ className: "bik-content" })`
+`, g = e.div.attrs({ className: "bik-content" })`
 	flex: 1;
 	min-width: 0;
 	min-height: 0;
@@ -69,7 +75,7 @@ const s = i`
 	flex-direction: column;
 	padding: 16px;
 	background: ${t.surface.standard};
-`, g = e.div.attrs({ className: "bik-content-card" })`
+`, m = e.div.attrs({ className: "bik-content-card" })`
 	flex: 1;
 	min-height: 0;
 	display: flex;
@@ -78,11 +84,11 @@ const s = i`
 	border: 1px solid ${t.stroke.primary};
 	border-radius: 8px;
 	box-sizing: border-box;
-`, m = e.div.attrs({ className: "bik-step-scroll" })`
+`, u = e.div.attrs({ className: "bik-step-scroll" })`
 	flex: 1;
 	min-height: 0;
 	overflow-y: auto;
-`, u = e.div.attrs({ className: "bik-footer" })`
+`, f = e.div.attrs({ className: "bik-footer" })`
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
@@ -91,20 +97,20 @@ const s = i`
 	border-top: 1px solid ${t.stroke.primary};
 	flex-shrink: 0;
 	box-shadow: 0px -2px 12px 0px #0000000a;
-`, f = e.div.attrs({ className: "bik-footer-hint" })`
+`, h = e.div.attrs({ className: "bik-footer-hint" })`
 	display: flex;
 	align-items: center;
 	gap: 6px;
-`, h = e.div.attrs({
+`, k = e.div.attrs({
   className: "bik-footer-actions"
 })`
 	display: flex;
 	align-items: center;
 	gap: 8px;
-`, k = e.div.attrs({ className: "bik-rail-list" })`
+`, y = e.div.attrs({ className: "bik-rail-list" })`
 	display: flex;
 	flex-direction: column;
-`, y = e.button.attrs({ className: "bik-rail-item" })`
+`, w = e.button.attrs({ className: "bik-rail-item" })`
 	position: relative;
 	display: flex;
 	align-items: flex-start;
@@ -136,7 +142,7 @@ const s = i`
 		border-left: 1px dashed #e0e0e0;
 		pointer-events: none;
 	}
-`, w = e.div.attrs({ className: "bik-step-badge" })`
+`, v = e.div.attrs({ className: "bik-step-badge" })`
 	width: 20px;
 	height: 20px;
 	flex-shrink: 0;
@@ -150,7 +156,7 @@ const s = i`
 	line-height: 12px;
 	background: ${(a) => a.state === "complete" ? t.background.inverseLight : a.state === "active" ? t.background.brandLight : t.background.base};
 	color: ${(a) => a.state === "complete" ? t.surface.standard : a.state === "active" ? t.background.inverseLight : t.content.secondary};
-`, v = e.div.attrs({
+`, N = e.div.attrs({
   className: "bik-section-header-wrap"
 })`
 	display: flex;
@@ -158,24 +164,24 @@ const s = i`
 	gap: 4px;
 	padding: 16px;
 	border-bottom: 1px solid ${t.stroke.primary};
-`, N = e.div.attrs({
+`, $ = e.div.attrs({
   className: "bik-section-header-wrap"
 })`
 	display: flex;
 	flex-direction: column;
 	gap: 16px;
 	padding: 16px;
-`, $ = e.div.attrs({ className: "bik-field-block" })`
+`, S = e.div.attrs({ className: "bik-field-block" })`
 	display: flex;
 	flex-direction: column;
 	gap: 8px;
-`, S = e.div.attrs({
+`, B = e.div.attrs({
   className: "bik-field-label-row"
 })`
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
-`, B = e.div.attrs({
+`, R = e.div.attrs({
   className: "bik-ai-text-area-shell"
 })`
 	display: flex;
@@ -187,7 +193,7 @@ const s = i`
 	gap: 8px;
 	min-height: ${(a) => a.minHeight ?? "120px"};
 	background: ${t.surface.standard};
-`, R = e.textarea.attrs({
+`, C = e.textarea.attrs({
   className: "bik-ai-text-area-input"
 })`
 	flex: 1;
@@ -204,34 +210,34 @@ const s = i`
 	&::placeholder {
 		color: ${t.content.placeholder};
 	}
-`, C = e.div.attrs({ className: "bik-card-row" })`
+`, A = e.div.attrs({ className: "bik-card-row" })`
 	display: flex;
 	gap: 12px;
-`, A = e.button.attrs({ className: "bik-radio-card" })`
+`, j = e.button.attrs({ className: "bik-radio-card" })`
 	flex: 1;
 	display: flex;
 	align-items: flex-start;
 	gap: 12px;
 	padding: 16px;
 	border: 1px solid
-		${(a) => a.selected ? t.stroke.brand : t.stroke.primary};
+		${(a) => a.selected ? i.brand[800] : t.stroke.primary};
 	background: ${(a) => a.selected ? t.background.brandLight : t.surface.standard};
 	border-radius: 8px;
 	cursor: pointer;
 	text-align: left;
 	width: 100%;
-`, j = e.div.attrs({
+`, L = e.div.attrs({
   className: "bik-radio-card-text"
 })`
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
-`, L = e.div.attrs({ className: "bik-chip-wrap" })`
+`, I = e.div.attrs({ className: "bik-chip-wrap" })`
 	display: flex;
 	flex-wrap: wrap;
 	align-items: center;
 	gap: 8px;
-`, I = e.div.attrs({ className: "bik-intent-chip" })`
+`, T = e.div.attrs({ className: "bik-intent-chip" })`
 	display: inline-flex;
 	align-items: center;
 	gap: 6px;
@@ -239,7 +245,7 @@ const s = i`
 	border: 1px solid ${t.stroke.primary};
 	border-radius: 4px;
 	background: ${t.surface.standard};
-`, T = e.button.attrs({
+`, F = e.button.attrs({
   className: "bik-chip-close-button"
 })`
 	display: flex;
@@ -249,7 +255,8 @@ const s = i`
 	background: transparent;
 	padding: 0;
 	cursor: pointer;
-`, F = e.button.attrs({
+`;
+e.button.attrs({
   className: "bik-add-chip-button"
 })`
 	display: inline-flex;
@@ -260,7 +267,8 @@ const s = i`
 	border-radius: 4px;
 	background: transparent;
 	cursor: pointer;
-`, z = e.div.attrs({
+`;
+const z = e.div.attrs({
   className: "bik-agent-step bik-agent-step--response"
 })`
 	display: flex;
@@ -282,11 +290,11 @@ const s = i`
 
 	/* Fill the remaining card height so a full-height child (e.g. the Step 3
 	   column divider) can stretch all the way down to the footer. */
-	${(a) => a.$grow && i`
+	${(a) => a.$grow && r`
 			flex: 1;
 			min-height: 0;
 		`}
-`, H = e.div.attrs({
+`, D = e.div.attrs({
   className: "bik-step3-divider"
 })`
 	width: 1px;
@@ -296,27 +304,29 @@ const s = i`
 	@media (max-width: 1100px) {
 		display: none;
 	}
-`, D = e.div.attrs({ className: "bik-side-section" })`
+`, H = e.div.attrs({ className: "bik-side-section" })`
 	display: flex;
 	flex-direction: column;
 	gap: 8px;
-`, W = e.div.attrs({
+`, O = e.div.attrs({
   className: "bik-side-section-header"
 })`
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
-`, O = e.button.attrs({
+`, W = e.button.attrs({
   className: "bik-add-icon-button"
 })`
 	${s}
-`, G = e.div.attrs({
+	background: ${t.surface.standard};
+	border: 1px solid ${t.stroke.primary};
+`, E = e.div.attrs({
   className: "bik-source-button-row"
 })`
 	display: flex;
 	flex-wrap: wrap;
 	gap: 8px;
-`, q = e.button.attrs({
+`, G = e.button.attrs({
   className: "bik-source-button"
 })`
 	display: flex;
@@ -332,7 +342,7 @@ const s = i`
 	&:hover {
 		background: ${t.surface.subdued};
 	}
-`, E = e.div.attrs({
+`, _ = e.div.attrs({
   className: "bik-selectable-row"
 })`
 	display: flex;
@@ -348,7 +358,7 @@ const s = i`
 	& > svg {
 		flex-shrink: 0;
 	}
-`, J = e.div.attrs({ className: "bik-row-text" })`
+`, q = e.div.attrs({ className: "bik-row-text" })`
 	flex: 1;
 	min-width: 0;
 	overflow: hidden;
@@ -372,22 +382,34 @@ e.button.attrs({
 	padding: 0;
 	cursor: pointer;
 `;
-const K = e.div.attrs({ className: "bik-row-actions" })`
+const J = e.div.attrs({ className: "bik-row-actions" })`
 	display: flex;
 	align-items: center;
 	gap: 4px;
 	flex-shrink: 0;
-`, P = e.span.attrs({
+`, K = e.span.attrs({
   className: "bik-row-action-divider"
 })`
 	width: 1px;
 	align-self: stretch;
 	margin: 4px 0;
 	background: ${t.stroke.primary};
-`, Q = e.button.attrs({
+`, P = e.button.attrs({
   className: "bik-row-menu-button"
 })`
 	${s}
+`, Q = e.div.attrs({
+  className: "bik-draft-button-scope"
+})`
+	display: flex;
+	flex: 1;
+
+	button {
+		border-color: ${i.brand[800]};
+	}
+	button .text {
+		color: ${i.brand[800]};
+	}
 `, U = e.div.attrs({ className: "bik-modal-body" })`
 	padding: 24px;
 	display: flex;
@@ -415,49 +437,49 @@ e.div.attrs({
 	gap: 8px;
 `;
 export {
-  F as AddChipButton,
-  O as AddIconButton,
-  R as AiTextAreaInput,
-  B as AiTextAreaShell,
-  c as BackButton,
-  n as BuilderRoot,
-  C as CardRow,
-  T as ChipCloseButton,
-  L as ChipWrap,
-  b as Content,
-  g as ContentCard,
-  $ as FieldBlock,
-  S as FieldLabelRow,
-  u as Footer,
-  h as FooterActions,
-  f as FooterHint,
-  I as IntentChip,
-  p as Main,
+  W as AddIconButton,
+  C as AiTextAreaInput,
+  R as AiTextAreaShell,
+  p as BackButton,
+  d as BuilderRoot,
+  A as CardRow,
+  F as ChipCloseButton,
+  I as ChipWrap,
+  g as Content,
+  m as ContentCard,
+  Q as DraftButtonScope,
+  S as FieldBlock,
+  B as FieldLabelRow,
+  f as Footer,
+  k as FooterActions,
+  h as FooterHint,
+  T as IntentChip,
+  x as Main,
   X as ModalActions,
   U as ModalBody,
   V as ModalIcon,
-  A as RadioCard,
-  j as RadioCardText,
-  x as Rail,
-  y as RailItem,
-  k as RailList,
-  P as RowActionDivider,
-  K as RowActions,
-  Q as RowMenuButton,
-  J as RowText,
-  N as SectionBodyWrap,
-  v as SectionHeaderWrap,
-  E as SelectableRow,
-  D as SideSection,
-  W as SideSectionHeader,
-  q as SourceButton,
-  G as SourceButtonRow,
-  H as Step3Divider,
+  j as RadioCard,
+  L as RadioCardText,
+  b as Rail,
+  w as RailItem,
+  y as RailList,
+  K as RowActionDivider,
+  J as RowActions,
+  P as RowMenuButton,
+  q as RowText,
+  $ as SectionBodyWrap,
+  N as SectionHeaderWrap,
+  _ as SelectableRow,
+  H as SideSection,
+  O as SideSectionHeader,
+  G as SourceButton,
+  E as SourceButtonRow,
+  D as Step3Divider,
   M as Step3Grid,
   z as Step3Root,
-  w as StepBadge,
-  m as StepScroll,
-  d as TopBar,
-  l as TopBarSide
+  v as StepBadge,
+  u as StepScroll,
+  l as TopBar,
+  c as TopBarSide
 };
 //# sourceMappingURL=AgentBuilder.styled.js.map

package/dist/esm/components/agent-builder/AgentBuilder.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"AgentBuilder.styled.js","sources":["../../../../src/components/agent-builder/AgentBuilder.styled.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\n// Shared look for the 24×24 transparent icon buttons (add / row-menu / close).\nconst iconActionButton = css`\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 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: 8px;\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\tmin-height: 0;\n\toverflow: hidden;\n\tdisplay: flex;\n\tflex-direction: column;\n\tpadding: 16px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ContentCard = styled.div.attrs({ className: 'bik-content-card' })`\n\tflex: 1;\n\tmin-height: 0;\n\tdisplay: flex;\n\tflex-direction: column;\n\toverflow: hidden;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tbox-sizing: border-box;\n`;\n\n// Scrollable step body inside the card; the footer stays pinned below it.\nexport const StepScroll = styled.div.attrs({ className: 'bik-step-scroll' })`\n\tflex: 1;\n\tmin-height: 0;\n\toverflow-y: auto;\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\tbox-shadow: 0px -2px 12px 0px #0000000a;\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: 10px;\n\tfont-weight: 400;\n\tline-height: 12px;\n\tbackground: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.background.inverseLight\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.background.brandLight\n\t\t\t: COLORS.background.base};\n\tcolor: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.surface.standard\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.background.inverseLight\n\t\t\t: COLORS.content.secondary};\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\tpadding: 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const SectionBodyWrap = styled.div.attrs({\n\tclassName: 'bik-section-header-wrap',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 16px;\n\tpadding: 16px;\n`;\n\nexport const FieldBlock = styled.div.attrs({ className: 'bik-field-block' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\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`;\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\n// Fills the scroll area so the step header + grow-body chain reaches the footer.\nexport const Step3Root = styled.div.attrs({\n\tclassName: 'bik-agent-step bik-agent-step--response',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-height: 100%;\n`;\n\nexport const Step3Grid = styled.div.attrs({ className: 'bik-step3-grid' })<{\n\t$grow?: boolean;\n}>`\n\tdisplay: grid;\n\tgrid-template-columns: minmax(0, 1fr) 1px 360px;\n\t/* Single row that fills the grid's height, so the divider spans the full\n\t   height (down to the footer) rather than stopping at the taller column. */\n\tgrid-template-rows: 1fr;\n\tflex: 1;\n\tmin-height: 0;\n\n\t@media (max-width: 1100px) {\n\t\tgrid-template-columns: 1fr;\n\t\tgrid-template-rows: auto;\n\t}\n\n\t/* Fill the remaining card height so a full-height child (e.g. the Step 3\n\t   column divider) can stretch all the way down to the footer. */\n\t${(p) =>\n\t\tp.$grow &&\n\t\tcss`\n\t\t\tflex: 1;\n\t\t\tmin-height: 0;\n\t\t`}\n`;\n\n// Vertical rule between the main column and the side (tools / sub-agents) column;\n// hidden once the grid collapses to a single column.\nexport const Step3Divider = styled.div.attrs({\n\tclassName: 'bik-step3-divider',\n})`\n\twidth: 1px;\n\talign-self: stretch;\n\tbackground: ${COLORS.stroke.primary};\n\n\t@media (max-width: 1100px) {\n\t\tdisplay: none;\n\t}\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\t${iconActionButton}\n`;\n\n// Empty-state tool-source picker (e.g. Manifest / Shopify buttons).\nexport const SourceButtonRow = styled.div.attrs({\n\tclassName: 'bik-source-button-row',\n})`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: 8px;\n`;\n\nexport const SourceButton = styled.button.attrs({\n\tclassName: 'bik-source-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 6px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: ${COLORS.surface.standard};\n\tcursor: pointer;\n\theight: 28px;\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\tmin-width: 0;\n\toverflow: hidden;\n\n\t/* Leading icon (e.g. tool source) keeps its size; the label takes the rest. */\n\t& > svg {\n\t\tflex-shrink: 0;\n\t}\n`;\n\nexport const RowText = styled.div.attrs({ className: 'bik-row-text' })`\n\tflex: 1;\n\tmin-width: 0;\n\toverflow: hidden;\n\n\t/* Truncate the label to one line with an ellipsis. */\n\t& > * {\n\t\tdisplay: block;\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\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\t${iconActionButton}\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/** 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":["iconActionButton","css","COLORS","BuilderRoot","styled","TopBar","TopBarSide","BackButton","Main","Rail","Content","ContentCard","StepScroll","Footer","FooterHint","FooterActions","RailList","RailItem","StepBadge","p","SectionHeaderWrap","SectionBodyWrap","FieldBlock","FieldLabelRow","AiTextAreaShell","AiTextAreaInput","CardRow","RadioCard","RadioCardText","ChipWrap","IntentChip","ChipCloseButton","AddChipButton","Step3Root","Step3Grid","Step3Divider","SideSection","SideSectionHeader","AddIconButton","SourceButtonRow","SourceButton","SelectableRow","RowText","RowActions","RowActionDivider","RowMenuButton","ModalBody","ModalIcon","ModalActions"],"mappings":"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"}
+{"version":3,"file":"AgentBuilder.styled.js","sources":["../../../../src/components/agent-builder/AgentBuilder.styled.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\n\n// Shared look for the 24×24 transparent icon buttons (add / row-menu / close).\nconst iconActionButton = css`\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\t&:disabled {\n\t\tcursor: not-allowed;\n\t\topacity: 0.5;\n\t\tbackground: transparent;\n\t}\n`;\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: 8px;\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\tmin-height: 0;\n\toverflow: hidden;\n\tdisplay: flex;\n\tflex-direction: column;\n\tpadding: 16px;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nexport const ContentCard = styled.div.attrs({ className: 'bik-content-card' })`\n\tflex: 1;\n\tmin-height: 0;\n\tdisplay: flex;\n\tflex-direction: column;\n\toverflow: hidden;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tbox-sizing: border-box;\n`;\n\n// Scrollable step body inside the card; the footer stays pinned below it.\nexport const StepScroll = styled.div.attrs({ className: 'bik-step-scroll' })`\n\tflex: 1;\n\tmin-height: 0;\n\toverflow-y: auto;\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\tbox-shadow: 0px -2px 12px 0px #0000000a;\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: 10px;\n\tfont-weight: 400;\n\tline-height: 12px;\n\tbackground: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.background.inverseLight\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.background.brandLight\n\t\t\t: COLORS.background.base};\n\tcolor: ${(p) =>\n\t\tp.state === 'complete'\n\t\t\t? COLORS.surface.standard\n\t\t\t: p.state === 'active'\n\t\t\t? COLORS.background.inverseLight\n\t\t\t: COLORS.content.secondary};\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\tpadding: 16px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const SectionBodyWrap = styled.div.attrs({\n\tclassName: 'bik-section-header-wrap',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 16px;\n\tpadding: 16px;\n`;\n\nexport const FieldBlock = styled.div.attrs({ className: 'bik-field-block' })`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\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`;\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 ? BASE_COLORS.brand['800'] : 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\n// Fills the scroll area so the step header + grow-body chain reaches the footer.\nexport const Step3Root = styled.div.attrs({\n\tclassName: 'bik-agent-step bik-agent-step--response',\n})`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-height: 100%;\n`;\n\nexport const Step3Grid = styled.div.attrs({ className: 'bik-step3-grid' })<{\n\t$grow?: boolean;\n}>`\n\tdisplay: grid;\n\tgrid-template-columns: minmax(0, 1fr) 1px 360px;\n\t/* Single row that fills the grid's height, so the divider spans the full\n\t   height (down to the footer) rather than stopping at the taller column. */\n\tgrid-template-rows: 1fr;\n\tflex: 1;\n\tmin-height: 0;\n\n\t@media (max-width: 1100px) {\n\t\tgrid-template-columns: 1fr;\n\t\tgrid-template-rows: auto;\n\t}\n\n\t/* Fill the remaining card height so a full-height child (e.g. the Step 3\n\t   column divider) can stretch all the way down to the footer. */\n\t${(p) =>\n\t\tp.$grow &&\n\t\tcss`\n\t\t\tflex: 1;\n\t\t\tmin-height: 0;\n\t\t`}\n`;\n\n// Vertical rule between the main column and the side (tools / sub-agents) column;\n// hidden once the grid collapses to a single column.\nexport const Step3Divider = styled.div.attrs({\n\tclassName: 'bik-step3-divider',\n})`\n\twidth: 1px;\n\talign-self: stretch;\n\tbackground: ${COLORS.stroke.primary};\n\n\t@media (max-width: 1100px) {\n\t\tdisplay: none;\n\t}\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\t${iconActionButton}\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n`;\n\n// Empty-state tool-source picker (e.g. Manifest / Shopify buttons).\nexport const SourceButtonRow = styled.div.attrs({\n\tclassName: 'bik-source-button-row',\n})`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: 8px;\n`;\n\nexport const SourceButton = styled.button.attrs({\n\tclassName: 'bik-source-button',\n})`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 6px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: ${COLORS.surface.standard};\n\tcursor: pointer;\n\theight: 28px;\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\tmin-width: 0;\n\toverflow: hidden;\n\n\t/* Leading icon (e.g. tool source) keeps its size; the label takes the rest. */\n\t& > svg {\n\t\tflex-shrink: 0;\n\t}\n`;\n\nexport const RowText = styled.div.attrs({ className: 'bik-row-text' })`\n\tflex: 1;\n\tmin-width: 0;\n\toverflow: hidden;\n\n\t/* Truncate the label to one line with an ellipsis. */\n\t& > * {\n\t\tdisplay: block;\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\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\t${iconActionButton}\n`;\n\nexport const DraftButtonScope = styled.div.attrs({\n\tclassName: 'bik-draft-button-scope',\n})`\n\tdisplay: flex;\n\tflex: 1;\n\n\tbutton {\n\t\tborder-color: ${BASE_COLORS.brand['800']};\n\t}\n\tbutton .text {\n\t\tcolor: ${BASE_COLORS.brand['800']};\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/** 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":["iconActionButton","css","COLORS","BuilderRoot","styled","TopBar","TopBarSide","BackButton","Main","Rail","Content","ContentCard","StepScroll","Footer","FooterHint","FooterActions","RailList","RailItem","StepBadge","p","SectionHeaderWrap","SectionBodyWrap","FieldBlock","FieldLabelRow","AiTextAreaShell","AiTextAreaInput","CardRow","RadioCard","BASE_COLORS","RadioCardText","ChipWrap","IntentChip","ChipCloseButton","Step3Root","Step3Grid","Step3Divider","SideSection","SideSectionHeader","AddIconButton","SourceButtonRow","SourceButton","SelectableRow","RowText","RowActions","RowActionDivider","RowMenuButton","DraftButtonScope","ModalBody","ModalIcon","ModalActions"],"mappings":"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"}

package/dist/esm/components/agent-builder/__fixtures__/agentValue.d.ts

@@ -0,0 +1,11 @@
+import { AgentValue, ParamsBlob } from '../AgentBuilder.model';
+/** A minimal, valid empty draft (every required field present). */
+export declare const emptyAgent: () => AgentValue;
+/** A fully-filled, all-steps-valid draft. */
+export declare const filledAgent: () => AgentValue;
+/** A catalog tool fixture with every AgentToolDoc field. */
+export declare const tool: (tool_id: string, display_name: string, source?: AgentToolDoc) => AgentToolDoc;
+/** A backend email-tool params template (mirrors the story seed). */
+export declare const EMAIL_TEMPLATE: ParamsBlob;
+/** A backend slack-tool params template. */
+export declare const SLACK_TEMPLATE: ParamsBlob;

package/dist/esm/components/agent-builder/components/AgentBuilderFooter.js

@@ -1,42 +1,49 @@
-import { jsxs as e, jsx as t, Fragment as u } from "react/jsx-runtime";
-import b from "../../../assets/icons/info.svg.js";
-import { BodySecondary as g } from "../../TypographyStyle.js";
-import { COLORS as i } from "../../../constants/Theme.js";
-import { Footer as x, FooterHint as h, FooterActions as y } from "../AgentBuilder.styled.js";
-import { useAgentBuilderContext as f } from "../context/AgentBuilderContext.js";
+import { jsxs as e, jsx as t, Fragment as g } from "react/jsx-runtime";
+import x from "../../../assets/icons/info.svg.js";
+import { BodyCaption as y } from "../../TypographyStyle.js";
+import { COLORS as r } from "../../../constants/Theme.js";
+import { Footer as h, FooterHint as f, FooterActions as v } from "../AgentBuilder.styled.js";
+import { useAgentBuilderContext as T } from "../context/AgentBuilderContext.js";
 import { Button as o } from "../../button/Button.js";
-const z = ({
+const A = ({
   footerHint: n,
-  onTestAgent: r,
+  onTestAgent: i,
   onGoLive: l,
   isPublishing: a
 }) => {
-  const { isFirstStep: s, isLastStep: d, goPrev: c, goNext: m, isActiveStepValid: p } = f();
-  return /* @__PURE__ */ e(x, { children: [
-    /* @__PURE__ */ e(h, { children: [
-      /* @__PURE__ */ t(b, { width: 16, height: 16, color: i.content.placeholder }),
-      /* @__PURE__ */ t(g, { color: i.content.placeholder, children: n })
+  const {
+    isFirstStep: s,
+    isLastStep: d,
+    goPrev: c,
+    goNext: p,
+    isActiveStepValid: m,
+    validation: u
+  } = T(), b = Object.values(u).every(Boolean);
+  return /* @__PURE__ */ e(h, { children: [
+    /* @__PURE__ */ e(f, { children: [
+      /* @__PURE__ */ t(x, { width: 14, height: 14, color: r.content.placeholder }),
+      /* @__PURE__ */ t(y, { color: r.content.placeholder, children: n })
     ] }),
-    /* @__PURE__ */ e(y, { children: [
+    /* @__PURE__ */ e(v, { children: [
       !s && /* @__PURE__ */ t(
         o,
         {
           "data-test": "agent-builder-back-step",
-          buttonType: "text",
+          buttonType: "tertiaryGray",
           size: "small",
           buttonText: "Back",
           onClick: c
         }
       ),
-      d ? /* @__PURE__ */ e(u, { children: [
-        r && /* @__PURE__ */ t(
+      d ? /* @__PURE__ */ e(g, { children: [
+        i && /* @__PURE__ */ t(
           o,
           {
             "data-test": "agent-builder-test",
             buttonType: "secondary",
             size: "small",
             buttonText: "Test agent",
-            onClick: r
+            onClick: i
           }
         ),
         /* @__PURE__ */ t(
@@ -46,6 +53,7 @@ const z = ({
             buttonType: "primary",
             size: "small",
             buttonText: "Go live",
+            disabled: !b,
             isLoading: a,
             onClick: l
           }
@@ -57,14 +65,14 @@ const z = ({
           buttonType: "primary",
           size: "small",
           buttonText: "Next",
-          disabled: !p,
-          onClick: m
+          disabled: !m,
+          onClick: p
         }
       )
     ] })
   ] });
 };
 export {
-  z as AgentBuilderFooter
+  A as AgentBuilderFooter
 };
 //# sourceMappingURL=AgentBuilderFooter.js.map

package/dist/esm/components/agent-builder/components/AgentBuilderFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"AgentBuilderFooter.js","sources":["../../../../../src/components/agent-builder/components/AgentBuilderFooter.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport React from 'react';\nimport { Button } from '@src/components/button';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { Footer, FooterActions, FooterHint } from '../AgentBuilder.styled';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\ninterface AgentBuilderFooterProps {\n\tfooterHint: string;\n\tonTestAgent?: () => void;\n\t/** Opens the go-live confirmation. */\n\tonGoLive: () => void;\n\tisPublishing?: boolean;\n}\n\nexport const AgentBuilderFooter: React.FC<AgentBuilderFooterProps> = ({\n\tfooterHint,\n\tonTestAgent,\n\tonGoLive,\n\tisPublishing,\n}) => {\n\tconst { isFirstStep, isLastStep, goPrev, goNext, isActiveStepValid } =\n\t\tuseAgentBuilderContext();\n\n\treturn (\n\t\t<Footer>\n\t\t\t<FooterHint>\n\t\t\t\t<InfoIcon width={16} height={16} color={COLORS.content.placeholder} />\n\t\t\t\t<BodySecondary color={COLORS.content.placeholder}>\n\t\t\t\t\t{footerHint}\n\t\t\t\t</BodySecondary>\n\t\t\t</FooterHint>\n\n\t\t\t<FooterActions>\n\t\t\t\t{!isFirstStep && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"agent-builder-back-step\"\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Back\"\n\t\t\t\t\t\tonClick={goPrev}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{isLastStep ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{onTestAgent && (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tdata-test=\"agent-builder-test\"\n\t\t\t\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tbuttonText=\"Test agent\"\n\t\t\t\t\t\t\t\tonClick={onTestAgent}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tdata-test=\"agent-builder-go-live\"\n\t\t\t\t\t\t\tbuttonType=\"primary\"\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tbuttonText=\"Go live\"\n\t\t\t\t\t\t\tisLoading={isPublishing}\n\t\t\t\t\t\t\tonClick={onGoLive}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"agent-builder-next\"\n\t\t\t\t\t\tbuttonType=\"primary\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Next\"\n\t\t\t\t\t\tdisabled={!isActiveStepValid}\n\t\t\t\t\t\tonClick={goNext}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</FooterActions>\n\t\t</Footer>\n\t);\n};\n"],"names":["AgentBuilderFooter","footerHint","onTestAgent","onGoLive","isPublishing","isFirstStep","isLastStep","goPrev","goNext","isActiveStepValid","useAgentBuilderContext","Footer","jsxs","FooterHint","jsx","InfoIcon","COLORS","BodySecondary","FooterActions","Button","Fragment"],"mappings":";;;;;;;AAgBO,MAAMA,IAAwD,CAAC;AAAA,EACrE,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AACD,MAAM;AACL,QAAM,EAAE,aAAAC,GAAa,YAAAC,GAAY,QAAAC,GAAQ,QAAAC,GAAQ,mBAAAC,EAAA,IAChDC,EAAA;AAED,2BACEC,GAAA,EACA,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACA,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAS,OAAO,IAAI,QAAQ,IAAI,OAAOC,EAAO,QAAQ,YAAA,CAAa;AAAA,wBACnEC,GAAA,EAAc,OAAOD,EAAO,QAAQ,aACnC,UAAAf,EAAA,CACF;AAAA,IAAA,GACD;AAAA,sBAECiB,GAAA,EACC,UAAA;AAAA,MAAA,CAACb,KACD,gBAAAS;AAAA,QAACK;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,YAAW;AAAA,UACX,MAAK;AAAA,UACL,YAAW;AAAA,UACX,SAASZ;AAAA,QAAA;AAAA,MAAA;AAAA,MAIVD,IACA,gBAAAM,EAAAQ,GAAA,EACE,UAAA;AAAA,QAAAlB,KACA,gBAAAY;AAAA,UAACK;AAAA,UAAA;AAAA,YACA,aAAU;AAAA,YACV,YAAW;AAAA,YACX,MAAK;AAAA,YACL,YAAW;AAAA,YACX,SAASjB;AAAA,UAAA;AAAA,QAAA;AAAA,QAGX,gBAAAY;AAAA,UAACK;AAAA,UAAA;AAAA,YACA,aAAU;AAAA,YACV,YAAW;AAAA,YACX,MAAK;AAAA,YACL,YAAW;AAAA,YACX,WAAWf;AAAA,YACX,SAASD;AAAA,UAAA;AAAA,QAAA;AAAA,MACV,EAAA,CACD,IAEA,gBAAAW;AAAA,QAACK;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,YAAW;AAAA,UACX,MAAK;AAAA,UACL,YAAW;AAAA,UACX,UAAU,CAACV;AAAA,UACX,SAASD;AAAA,QAAA;AAAA,MAAA;AAAA,IACV,EAAA,CAEF;AAAA,EAAA,GACD;AAEF;"}
+{"version":3,"file":"AgentBuilderFooter.js","sources":["../../../../../src/components/agent-builder/components/AgentBuilderFooter.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport React from 'react';\nimport { Button } from '@src/components/button';\nimport { BodyCaption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { Footer, FooterActions, FooterHint } from '../AgentBuilder.styled';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\ninterface AgentBuilderFooterProps {\n\tfooterHint: string;\n\tonTestAgent?: () => void;\n\t/** Opens the go-live confirmation. */\n\tonGoLive: () => void;\n\tisPublishing?: boolean;\n}\n\nexport const AgentBuilderFooter: React.FC<AgentBuilderFooterProps> = ({\n\tfooterHint,\n\tonTestAgent,\n\tonGoLive,\n\tisPublishing,\n}) => {\n\tconst {\n\t\tisFirstStep,\n\t\tisLastStep,\n\t\tgoPrev,\n\t\tgoNext,\n\t\tisActiveStepValid,\n\t\tvalidation,\n\t} = useAgentBuilderContext();\n\t// Publishing requires every step complete, not just the active one.\n\tconst allStepsValid = Object.values(validation).every(Boolean);\n\n\treturn (\n\t\t<Footer>\n\t\t\t<FooterHint>\n\t\t\t\t<InfoIcon width={14} height={14} color={COLORS.content.placeholder} />\n\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t{footerHint}\n\t\t\t\t</BodyCaption>\n\t\t\t</FooterHint>\n\n\t\t\t<FooterActions>\n\t\t\t\t{!isFirstStep && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"agent-builder-back-step\"\n\t\t\t\t\t\t// tertiaryGray = #616161 text; \"text\" renders brand purple.\n\t\t\t\t\t\tbuttonType=\"tertiaryGray\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Back\"\n\t\t\t\t\t\tonClick={goPrev}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{isLastStep ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{onTestAgent && (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tdata-test=\"agent-builder-test\"\n\t\t\t\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tbuttonText=\"Test agent\"\n\t\t\t\t\t\t\t\tonClick={onTestAgent}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tdata-test=\"agent-builder-go-live\"\n\t\t\t\t\t\t\tbuttonType=\"primary\"\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tbuttonText=\"Go live\"\n\t\t\t\t\t\t\tdisabled={!allStepsValid}\n\t\t\t\t\t\t\tisLoading={isPublishing}\n\t\t\t\t\t\t\tonClick={onGoLive}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"agent-builder-next\"\n\t\t\t\t\t\tbuttonType=\"primary\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Next\"\n\t\t\t\t\t\tdisabled={!isActiveStepValid}\n\t\t\t\t\t\tonClick={goNext}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</FooterActions>\n\t\t</Footer>\n\t);\n};\n"],"names":["AgentBuilderFooter","footerHint","onTestAgent","onGoLive","isPublishing","isFirstStep","isLastStep","goPrev","goNext","isActiveStepValid","validation","useAgentBuilderContext","allStepsValid","Footer","jsxs","FooterHint","jsx","InfoIcon","COLORS","BodyCaption","FooterActions","Button","Fragment"],"mappings":";;;;;;;AAgBO,MAAMA,IAAwD,CAAC;AAAA,EACrE,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AACD,MAAM;AACL,QAAM;AAAA,IACL,aAAAC;AAAA,IACA,YAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,YAAAC;AAAA,EAAA,IACGC,EAAA,GAEEC,IAAgB,OAAO,OAAOF,CAAU,EAAE,MAAM,OAAO;AAE7D,2BACEG,GAAA,EACA,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACA,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAS,OAAO,IAAI,QAAQ,IAAI,OAAOC,EAAO,QAAQ,YAAA,CAAa;AAAA,wBACnEC,GAAA,EAAY,OAAOD,EAAO,QAAQ,aACjC,UAAAjB,EAAA,CACF;AAAA,IAAA,GACD;AAAA,sBAECmB,GAAA,EACC,UAAA;AAAA,MAAA,CAACf,KACD,gBAAAW;AAAA,QAACK;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UAEV,YAAW;AAAA,UACX,MAAK;AAAA,UACL,YAAW;AAAA,UACX,SAASd;AAAA,QAAA;AAAA,MAAA;AAAA,MAIVD,IACA,gBAAAQ,EAAAQ,GAAA,EACE,UAAA;AAAA,QAAApB,KACA,gBAAAc;AAAA,UAACK;AAAA,UAAA;AAAA,YACA,aAAU;AAAA,YACV,YAAW;AAAA,YACX,MAAK;AAAA,YACL,YAAW;AAAA,YACX,SAASnB;AAAA,UAAA;AAAA,QAAA;AAAA,QAGX,gBAAAc;AAAA,UAACK;AAAA,UAAA;AAAA,YACA,aAAU;AAAA,YACV,YAAW;AAAA,YACX,MAAK;AAAA,YACL,YAAW;AAAA,YACX,UAAU,CAACT;AAAA,YACX,WAAWR;AAAA,YACX,SAASD;AAAA,UAAA;AAAA,QAAA;AAAA,MACV,EAAA,CACD,IAEA,gBAAAa;AAAA,QAACK;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,YAAW;AAAA,UACX,MAAK;AAAA,UACL,YAAW;AAAA,UACX,UAAU,CAACZ;AAAA,UACX,SAASD;AAAA,QAAA;AAAA,MAAA;AAAA,IACV,EAAA,CAEF;AAAA,EAAA,GACD;AAEF;"}