flow

comps/form/field/FieldInput.tsx

@@ -147,7 +147,7 @@ export const FieldInput: FC<{
             "field-inner c-flex-1 c-flex c-items-center",
             field.type === "link" && "c-justify-end",
             field.focused && "focused",
-            disabled && "c-pointer-events-none"
+            disabled && "c-pointer-events-none c-bg-gray-50"
           )}
         >
           {not_ready ? (

comps/ui/flow.tsx

@@ -0,0 +1,26 @@
+import { FC } from "react";
+
+export const Flow: FC<{
+  children: any;
+  PassProp: any;
+  flow: { text: string; popover: any; icon: any }[];
+  props?: any;
+}> = ({ PassProp, children, flow, props }) => {
+  return (
+    <div {...props} className={cx(props.className, "c-flex-row")}>
+      {flow.map((item, idx) => {
+        return (
+          <PassProp
+            flow={flow}
+            item={item}
+            idx={idx}
+            key={idx}
+            is_last={idx === flow.length - 1}
+          >
+            {children}
+          </PassProp>
+        );
+      })}
+    </div>
+  );
+};

comps/ui/typeahead.tsx

@@ -518,6 +518,7 @@ export const Typeahead: FC<{
               }
             }
           }}
+          disabled={disabled}
           spellCheck={false}
           className={cx(
             "c-flex-1 c-mb-2 c-text-sm c-outline-none c-bg-transparent",

exports.tsx

@@ -121,3 +121,5 @@ export { getPathname } from "@/utils/pathname";
 
 export * from "@/comps/ui/input";
 export * from "@/comps/ui/typeahead";
+
+export {Flow} from "@/comps/ui/flow"