frontastic_typescript_tastic_component_with_tailwind_styling.ts

1import React from 'react';
2import { TasticProps } from './types';
3
4interface Data {
5  text: string;
6}
7
8const HelloWorldTastic = ({ data }: TasticProps<Data>) => {
9  return (
10    <div className="p-4 bg-white shadow-md rounded-lg">
11      <h2 className="text-xl font-bold text-gray-800">
12        {data?.text || 'Hello, Frontastic!'}
13      </h2>
14      <p className="mt-2 text-gray-600">
15        This is a custom Tastic built with the theme-clean-boost foundation.
16      </p>
17    </div>
18  );
19};
20
21export default HelloWorldTastic;