[Home](./index.md) > [@empathyco/x-components](./x-components.md) > [SearchInputPlaceholder](./x-components.searchinputplaceholder.md) ## SearchInputPlaceholder variable . This component renders an animated placeholder for the search input in the shape of a list of iterating messages that can be configured to happen always or only when hovering the input **Signature:** ```typescript _default: import("vue").DefineComponent; required: true; }; animation: { type: (StringConstructor | ObjectConstructor | FunctionConstructor)[]; default: () => import("vue").VNode; }; animationIntervalMs: { type: NumberConstructor; default: number; }; animateOnlyOnHover: BooleanConstructor; }>, { isVisible: import("vue").ComputedRef; message: import("vue").ComputedRef; }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly; required: true; }; animation: { type: (StringConstructor | ObjectConstructor | FunctionConstructor)[]; default: () => import("vue").VNode; }; animationIntervalMs: { type: NumberConstructor; default: number; }; animateOnlyOnHover: BooleanConstructor; }>> & Readonly<{}>, { animateOnlyOnHover: boolean; animation: string | Function | Record; animationIntervalMs: number; }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any> ```