myoperator-ui 0.0.221-beta.0 → 0.0.221

package/dist/index.js

@@ -5063,7 +5063,7 @@ Table.displayName = "Table";
 const TableHeader = React.forwardRef(({ className, ...props }: React.HTMLAttributes<HTMLTableSectionElement>, ref: React.Ref<HTMLTableSectionElement>) => (
   <thead
     ref={ref}
-    className={cn("bg-[var(--color-neutral-100)] [&_tr]:border-b", className)}
+    className={cn("bg-[var(--color-neutral-100)] [&_tr]:border-b [&_tr]:border-solid", className)}
     {...props}
   />
 ));
@@ -17675,7 +17675,7 @@ export const IvrBotConfig = React.forwardRef(
           </div>
 
           {/* Right column \u2014 gray panel extending full height */}
-          <div className="flex flex-col gap-6 px-4 py-4 sm:px-6 sm:py-6 lg:flex-[2] min-w-0 bg-semantic-bg-ui border-l border-semantic-border-layout">
+          <div className="flex flex-col gap-6 px-4 py-4 sm:px-6 sm:py-6 lg:flex-[2] min-w-0 bg-semantic-bg-ui border-l border-solid border-semantic-border-layout">
             <KnowledgeBaseCard
               files={data.knowledgeBaseFiles}
               onAdd={() => setUploadOpen(true)}
@@ -18008,7 +18008,7 @@ function VarPopup({
     <div
       role="listbox"
       style={style}
-      className="absolute z-[9999] min-w-[14rem] max-w-sm rounded-md border border-semantic-border-layout bg-semantic-bg-primary py-1 text-semantic-text-primary shadow-md"
+      className="absolute z-[9999] min-w-[14rem] max-w-sm rounded-md border border-solid border-semantic-border-layout bg-semantic-bg-primary py-1 text-semantic-text-primary shadow-md"
     >
       {/* Add new variable */}
       {onAddVariable && (
@@ -18021,7 +18021,7 @@ function VarPopup({
             <Plus className="size-3.5 shrink-0" />
             Add new variable
           </button>
-          <div className="border-t border-semantic-border-layout" />
+          <div className="border-t border-solid border-semantic-border-layout" />
         </>
       )}
 
@@ -18322,7 +18322,7 @@ function VariableInput({
             className={cn(
               "flex items-center gap-1 px-2",
               !isExpanded && "flex-1 min-w-0 overflow-hidden",
-              isExpanded && "flex-wrap bg-semantic-bg-primary border border-semantic-border-input rounded py-1.5 shadow-sm"
+              isExpanded && "flex-wrap bg-semantic-bg-primary border border-solid border-semantic-border-input rounded py-1.5 shadow-sm"
             )}
           >
             {segments.map((seg, i) =>
@@ -18383,7 +18383,7 @@ function VariableInput({
 
 // \u2500\u2500 Shared input/textarea styles \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
 const inputCls = cn(
-  "w-full h-[42px] px-4 text-base rounded border",
+  "w-full h-[42px] px-4 text-base rounded border border-solid",
   "border-semantic-border-input bg-semantic-bg-primary",
   "text-semantic-text-primary placeholder:text-semantic-text-muted",
   "outline-none",
@@ -18392,7 +18392,7 @@ const inputCls = cn(
 );
 
 const textareaCls = cn(
-  "w-full px-4 py-2.5 text-base rounded border resize-none",
+  "w-full px-4 py-2.5 text-base rounded border border-solid resize-none",
   "border-semantic-border-input bg-semantic-bg-primary",
   "text-semantic-text-primary placeholder:text-semantic-text-muted",
   "outline-none",
@@ -18462,10 +18462,10 @@ function KeyValueTable({
   return (
     <div className="flex flex-col gap-1.5">
       <span className="text-sm text-semantic-text-muted">{label}</span>
-      <div className="border border-semantic-border-layout rounded">
+      <div className="border border-solid border-semantic-border-layout rounded">
         {/* Column headers \u2014 desktop only; border-r on Key cell defines column boundary */}
-        <div className="hidden sm:flex border-b border-semantic-border-layout rounded-t">
-          <div className="flex-1 min-w-0 px-3 py-2 text-sm font-semibold text-semantic-text-muted border-r border-semantic-border-layout">
+        <div className="hidden sm:flex border-b border-solid border-semantic-border-layout rounded-t">
+          <div className="flex-1 min-w-0 px-3 py-2 text-sm font-semibold text-semantic-text-muted border-r border-solid border-semantic-border-layout">
             Key
           </div>
           <div className="flex-[2] min-w-0 px-3 py-2 text-sm font-semibold text-semantic-text-muted">
@@ -18480,10 +18480,10 @@ function KeyValueTable({
           return (
             <div
               key={row.id}
-              className="border-b border-semantic-border-layout last:border-b-0 flex items-center min-h-0"
+              className="border-b border-solid border-semantic-border-layout last:border-b-0 flex items-center min-h-0"
             >
               {/* Key column \u2014 border-r on column (not input) so it aligns with header */}
-              <div className="flex-1 flex flex-col min-w-0 sm:border-r sm:border-semantic-border-layout">
+              <div className="flex-1 flex flex-col min-w-0 sm:border-r sm:border-solid sm:border-semantic-border-layout">
                 <span className="sm:hidden px-3 pt-2.5 pb-0.5 text-sm font-semibold text-semantic-text-muted uppercase tracking-wide">
                   Key
                 </span>
@@ -18528,7 +18528,7 @@ function KeyValueTable({
               </div>
 
               {/* Action column \u2014 delete aligned with row (same as KeyValueRow / knowledge-base-card) */}
-              <div className="w-10 sm:w-10 flex items-center justify-center shrink-0 self-stretch border-l border-semantic-border-layout sm:border-l-0">
+              <div className="w-10 sm:w-10 flex items-center justify-center shrink-0 self-stretch border-l border-solid border-semantic-border-layout sm:border-l-0">
                 <Button
                   type="button"
                   variant="ghost"
@@ -18902,7 +18902,7 @@ export const CreateFunctionModal = React.forwardRef(
           )}
         >
           {/* \u2500\u2500 Header \u2500\u2500 */}
-          <div className="flex items-center justify-between px-4 py-4 border-b border-semantic-border-layout shrink-0 sm:px-6">
+          <div className="flex items-center justify-between px-4 py-4 border-b border-solid border-semantic-border-layout shrink-0 sm:px-6">
             <DialogTitle className="text-base font-semibold text-semantic-text-primary">
               {isEditing ? "Edit Function" : "Create Function"}
             </DialogTitle>
@@ -18984,13 +18984,13 @@ export const CreateFunctionModal = React.forwardRef(
                   </span>
                   <div
                     className={cn(
-                      "flex h-[42px] rounded border border-semantic-border-input overflow-visible bg-semantic-bg-primary",
+                      "flex h-[42px] rounded border border-solid border-semantic-border-input overflow-visible bg-semantic-bg-primary",
                       "focus-within:border-semantic-border-input-focus focus-within:shadow-[0_0_0_1px_rgba(43,188,202,0.15)]",
                       "transition-shadow"
                     )}
                   >
                     {/* Method selector */}
-                    <div className="relative shrink-0 border-r border-semantic-border-layout">
+                    <div className="relative shrink-0 border-r border-solid border-semantic-border-layout">
                       <select
                         value={method}
                         disabled={disabled}
@@ -19065,7 +19065,7 @@ export const CreateFunctionModal = React.forwardRef(
                 <div className="flex flex-col gap-4">
                   <div
                     className={cn(
-                      "flex border-b border-semantic-border-layout",
+                      "flex border-b border-solid border-semantic-border-layout",
                       "overflow-x-auto",
                       "[&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]"
                     )}
@@ -19078,7 +19078,7 @@ export const CreateFunctionModal = React.forwardRef(
                         className={cn(
                           "px-3 py-2 text-sm font-semibold transition-colors whitespace-nowrap shrink-0",
                           activeTab === tab
-                            ? "text-semantic-text-secondary border-b-2 border-semantic-text-secondary -mb-px"
+                            ? "text-semantic-text-secondary border-b-2 border-solid border-semantic-text-secondary -mb-px"
                             : "text-semantic-text-muted hover:text-semantic-text-primary"
                         )}
                       >
@@ -19183,7 +19183,7 @@ export const CreateFunctionModal = React.forwardRef(
                     <span className="text-sm font-semibold text-semantic-text-muted tracking-[0.048px]">
                       Test Your API
                     </span>
-                    <div className="border-t border-semantic-border-layout" />
+                    <div className="border-t border-solid border-semantic-border-layout" />
                   </div>
 
                   {/* Variable test values \u2014 shown when URL/body/params contain {{variables}} */}
@@ -19231,7 +19231,7 @@ export const CreateFunctionModal = React.forwardRef(
                       readOnly
                       value={apiResponse}
                       rows={4}
-                      className="w-full px-3 py-2.5 text-base rounded border border-semantic-border-layout bg-semantic-bg-ui text-semantic-text-primary resize-none outline-none"
+                      className="w-full px-3 py-2.5 text-base rounded border border-solid border-semantic-border-layout bg-semantic-bg-ui text-semantic-text-primary resize-none outline-none"
                       placeholder=""
                     />
                   </div>
@@ -19241,7 +19241,7 @@ export const CreateFunctionModal = React.forwardRef(
           </div>
 
           {/* \u2500\u2500 Footer \u2500\u2500 */}
-          <div className="flex items-center justify-between gap-3 px-4 py-3 border-t border-semantic-border-layout shrink-0 sm:px-6 sm:py-4">
+          <div className="flex items-center justify-between gap-3 px-4 py-3 border-t border-solid border-semantic-border-layout shrink-0 sm:px-6 sm:py-4">
             {step === 1 ? (
               <>
                 <Button
@@ -19446,7 +19446,7 @@ function StyledInput({
       disabled={disabled}
       maxLength={maxLength}
       className={cn(
-        "w-full h-[42px] px-4 text-base rounded border",
+        "w-full h-[42px] px-4 text-base rounded border border-solid",
         "border-semantic-border-input bg-semantic-bg-primary",
         "text-semantic-text-primary placeholder:text-semantic-text-muted",
         "outline-none hover:border-semantic-border-input-focus",
@@ -19523,12 +19523,12 @@ const BotIdentityCard = React.forwardRef(
       <div
         ref={ref}
         className={cn(
-          "bg-semantic-bg-primary border border-semantic-border-layout rounded-lg",
+          "bg-semantic-bg-primary border border-solid border-semantic-border-layout rounded-lg",
           className
         )}
       >
         {/* Header */}
-        <div className="flex items-center justify-between px-4 py-4 border-b border-semantic-border-layout sm:px-6">
+        <div className="flex items-center justify-between px-4 py-4 border-b border-solid border-semantic-border-layout sm:px-6">
           <h2 className="m-0 text-base font-semibold text-semantic-text-primary">
             Who The Bot Is
           </h2>
@@ -19812,7 +19812,7 @@ function VarPopup({
     <div
       role="listbox"
       style={style}
-      className="absolute z-[9999] min-w-[8rem] max-w-xs overflow-hidden rounded-md border border-semantic-border-layout bg-semantic-bg-primary p-1 text-semantic-text-primary shadow-md"
+      className="absolute z-[9999] min-w-[8rem] max-w-xs overflow-hidden rounded-md border border-solid border-semantic-border-layout bg-semantic-bg-primary p-1 text-semantic-text-primary shadow-md"
     >
       {variables.map((v) => (
         <button
@@ -19847,11 +19847,11 @@ function SectionCard({
   return (
     <div
       className={cn(
-        "bg-semantic-bg-primary border border-semantic-border-layout rounded-lg",
+        "bg-semantic-bg-primary border border-solid border-semantic-border-layout rounded-lg",
         className
       )}
     >
-      <div className="flex items-center justify-between px-4 py-4 border-b border-semantic-border-layout sm:px-6">
+      <div className="flex items-center justify-between px-4 py-4 border-b border-solid border-semantic-border-layout sm:px-6">
         <h2 className="m-0 text-base font-semibold text-semantic-text-primary">
           {title}
         </h2>
@@ -19994,7 +19994,7 @@ const BotBehaviorCard = React.forwardRef(
                 placeholder="You are a helpful assistant. Always start by greeting the user politely: 'Hello! Welcome. How can I assist you today?'"
                 disabled={disabled}
                 className={cn(
-                  "w-full px-4 py-2.5 text-base rounded border resize-none pb-10 pr-[4.5rem]",
+                  "w-full px-4 py-2.5 text-base rounded border border-solid resize-none pb-10 pr-[4.5rem]",
                   "border-semantic-border-input bg-semantic-bg-primary",
                   "text-semantic-text-primary placeholder:text-semantic-text-muted",
                   "outline-none hover:border-semantic-border-input-focus",
@@ -20120,12 +20120,12 @@ const KnowledgeBaseCard = React.forwardRef(
       <div
         ref={ref}
         className={cn(
-          "bg-semantic-bg-primary border border-semantic-border-layout rounded-lg overflow-hidden",
+          "bg-semantic-bg-primary border border-solid border-semantic-border-layout rounded-lg overflow-hidden",
           className
         )}
       >
           {/* Header */}
-          <div className="flex items-center justify-between px-4 py-4 border-b border-semantic-border-layout sm:px-6">
+          <div className="flex items-center justify-between px-4 py-4 border-b border-solid border-semantic-border-layout sm:px-6">
             <div className="flex items-center gap-1.5">
               <h2 className="m-0 text-base font-semibold text-semantic-text-primary">
                 Knowledge Base
@@ -20272,12 +20272,12 @@ const FunctionsCard = React.forwardRef(
       <div
         ref={ref}
         className={cn(
-          "bg-semantic-bg-primary border border-semantic-border-layout rounded-lg overflow-hidden",
+          "bg-semantic-bg-primary border border-solid border-semantic-border-layout rounded-lg overflow-hidden",
           className
         )}
       >
         {/* Header */}
-        <div className="flex items-center justify-between px-4 py-4 border-b border-semantic-border-layout sm:px-6">
+        <div className="flex items-center justify-between px-4 py-4 border-b border-solid border-semantic-border-layout sm:px-6">
           <div className="flex items-center gap-1.5">
             <h2 className="m-0 text-base font-semibold text-semantic-text-primary">
               Functions
@@ -20316,7 +20316,7 @@ const FunctionsCard = React.forwardRef(
               {functions.map((fn) => (
                 <div
                   key={fn.id}
-                  className="flex items-center justify-between px-4 py-3 rounded border border-semantic-border-layout bg-semantic-bg-primary"
+                  className="flex items-center justify-between px-4 py-3 rounded border border-solid border-semantic-border-layout bg-semantic-bg-primary"
                 >
                   <div className="flex items-center gap-2 min-w-0">
                     {fn.tooltip ? (
@@ -20459,13 +20459,13 @@ const FrustrationHandoverCard = React.forwardRef(
       <div
         ref={ref}
         className={cn(
-          "bg-semantic-bg-primary border border-semantic-border-layout rounded-lg overflow-hidden",
+          "bg-semantic-bg-primary border border-solid border-semantic-border-layout rounded-lg overflow-hidden",
           className
         )}
       >
         <Accordion type="single">
           <AccordionItem value="frustration">
-            <AccordionTrigger className="px-4 py-4 border-b border-semantic-border-layout hover:no-underline sm:px-6 sm:py-5">
+            <AccordionTrigger className="px-4 py-4 border-b border-solid border-semantic-border-layout hover:no-underline sm:px-6 sm:py-5">
               <span className="flex items-center gap-1.5 text-base font-semibold text-semantic-text-primary">
                 Frustration Handover
                 <Info className="size-3.5 text-semantic-text-muted shrink-0" />
@@ -20591,7 +20591,7 @@ function NumberSpinner({
   disabled?: boolean;
 }) {
   return (
-    <div className={cn("flex w-full items-center gap-2.5 px-4 py-2.5 border border-semantic-border-layout bg-semantic-bg-primary rounded", disabled && "opacity-50 cursor-not-allowed")}>
+    <div className={cn("flex w-full items-center gap-2.5 px-4 py-2.5 border border-solid border-semantic-border-layout bg-semantic-bg-primary rounded", disabled && "opacity-50 cursor-not-allowed")}>
       <input
         type="number"
         value={value}
@@ -20645,13 +20645,13 @@ const AdvancedSettingsCard = React.forwardRef(
       <div
         ref={ref}
         className={cn(
-          "bg-semantic-bg-primary border border-semantic-border-layout rounded-lg overflow-hidden",
+          "bg-semantic-bg-primary border border-solid border-semantic-border-layout rounded-lg overflow-hidden",
           className
         )}
       >
         <Accordion type="single">
           <AccordionItem value="advanced">
-            <AccordionTrigger className="px-4 py-4 border-b border-semantic-border-layout hover:no-underline sm:px-6 sm:py-5">
+            <AccordionTrigger className="px-4 py-4 border-b border-solid border-semantic-border-layout hover:no-underline sm:px-6 sm:py-5">
               <span className="text-base font-semibold text-semantic-text-primary">
                 Advanced Settings
               </span>
@@ -20659,7 +20659,7 @@ const AdvancedSettingsCard = React.forwardRef(
             <AccordionContent>
               <div className="flex flex-col">
                 {/* Number fields section */}
-                <div className="px-4 pt-4 pb-4 flex flex-col gap-5 border-b border-semantic-border-layout sm:px-6 sm:pt-5 sm:pb-6">
+                <div className="px-4 pt-4 pb-4 flex flex-col gap-5 border-b border-solid border-semantic-border-layout sm:px-6 sm:pt-5 sm:pb-6">
                   <Field label="Silence Timeout (seconds)">
                     <NumberSpinner
                       value={data.silenceTimeout ?? 15}
@@ -20791,7 +20791,7 @@ function PromptField({
         onChange={(e) => onChange(e.target.value)}
         onBlur={(e) => onBlur?.(e.target.value)}
         className={cn(
-          "w-full resize-none rounded border border-semantic-border-layout bg-semantic-bg-primary px-3 py-2.5 text-base text-semantic-text-primary placeholder:text-semantic-text-muted outline-none transition-all",
+          "w-full resize-none rounded border border-solid border-semantic-border-layout bg-semantic-bg-primary px-3 py-2.5 text-base text-semantic-text-primary placeholder:text-semantic-text-muted outline-none transition-all",
           "focus:outline-none focus:border-semantic-border-input-focus/50 focus:shadow-[0_0_0_1px_rgba(43,188,202,0.15)]",
           disabled && "cursor-not-allowed opacity-50"
         )}
@@ -20823,7 +20823,7 @@ const FallbackPromptsCard = React.forwardRef(
       <div
         ref={ref}
         className={cn(
-          "bg-semantic-bg-primary border border-semantic-border-layout rounded-lg overflow-hidden",
+          "bg-semantic-bg-primary border border-solid border-semantic-border-layout rounded-lg overflow-hidden",
           className
         )}
       >
@@ -20832,7 +20832,7 @@ const FallbackPromptsCard = React.forwardRef(
           defaultValue={defaultOpen ? ["fallback"] : []}
         >
           <AccordionItem value="fallback">
-            <AccordionTrigger className="px-4 py-4 border-b border-semantic-border-layout hover:no-underline sm:px-6 sm:py-5">
+            <AccordionTrigger className="px-4 py-4 border-b border-solid border-semantic-border-layout hover:no-underline sm:px-6 sm:py-5">
               <span className="flex items-center gap-1.5 text-base font-semibold text-semantic-text-primary">
                 Fallback Prompts
                 <Info className="size-3.5 text-semantic-text-muted shrink-0" />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "myoperator-ui",
-  "version": "0.0.221-beta.0",
+  "version": "0.0.221",
   "description": "CLI for adding myOperator UI components to your project",
   "type": "module",
   "exports": "./dist/index.js",