@stackshift-ui/team 6.0.3 → 6.0.4

package/package.json

@@ -1,14 +1,15 @@
 {
   "name": "@stackshift-ui/team",
   "description": "",
-  "version": "6.0.3",
+  "version": "6.0.4",
   "private": false,
   "sideEffects": false,
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
   "files": [
-    "dist/**"
+    "dist/**",
+    "src"
   ],
   "author": "WebriQ <info@webriq.com>",
   "devDependencies": {
@@ -33,17 +34,17 @@
   },
   "dependencies": {
     "classnames": "^2.5.1",
-    "@stackshift-ui/system": "6.0.2",
-    "@stackshift-ui/avatar": "6.0.2",
-    "@stackshift-ui/button": "6.0.2",
-    "@stackshift-ui/card": "6.0.2",
+    "@stackshift-ui/button": "6.0.3",
+    "@stackshift-ui/card": "6.0.3",
+    "@stackshift-ui/system": "6.0.3",
     "@stackshift-ui/scripts": "6.0.2",
-    "@stackshift-ui/text": "6.0.2",
-    "@stackshift-ui/image": "6.0.2",
-    "@stackshift-ui/section": "6.0.2",
-    "@stackshift-ui/container": "6.0.2",
-    "@stackshift-ui/flex": "6.0.2",
-    "@stackshift-ui/heading": "6.0.2"
+    "@stackshift-ui/heading": "6.0.3",
+    "@stackshift-ui/text": "6.0.3",
+    "@stackshift-ui/image": "6.0.3",
+    "@stackshift-ui/section": "6.0.3",
+    "@stackshift-ui/container": "6.0.3",
+    "@stackshift-ui/flex": "6.0.3",
+    "@stackshift-ui/avatar": "6.0.3"
   },
   "peerDependencies": {
     "@types/react": "16.8 - 19",

package/src/index.ts

@@ -0,0 +1,8 @@
+"use client";
+
+// component exports
+export * from "./team";
+export * from "./team_a";
+export * from "./team_b";
+export * from "./team_c";
+export * from "./team_d";

package/src/team.test.tsx

@@ -0,0 +1,13 @@
+import { cleanup, render, screen } from "@testing-library/react";
+import { afterEach, describe, test } from "vitest";
+import { Team } from "./team";
+
+describe.concurrent("team", () => {
+  afterEach(cleanup);
+
+  test.skip("Dummy test - test if renders without errors", ({ expect }) => {
+    const clx = "my-class";
+    render(<Team />);
+    expect(screen.getByTestId("{ kebabCase name }}").classList).toContain(clx);
+  });
+});

package/src/team.tsx

@@ -0,0 +1,39 @@
+import { lazy } from "react";
+import { SectionsProps, Team as ITeam } from "./types";
+
+const Variants = {
+  variant_a: lazy(() => import("./team_a")),
+  variant_b: lazy(() => import("./team_b")),
+  variant_c: lazy(() => import("./team_c")),
+  variant_d: lazy(() => import("./team_d")),
+};
+
+export interface MemberTextProps {
+  member: {
+    name?: string;
+    plainText?: string;
+    jobTitle?: string;
+  };
+}
+
+export interface TeamsProps {
+  caption?: string;
+  title?: string;
+  team?: ITeam[];
+}
+
+const displayName = "Team";
+
+export const Team: React.FC<SectionsProps> = ({ data }) => {
+  const variant = data?.variant;
+  const Variant = variant && Variants[variant as keyof typeof Variants];
+
+  const props = {
+    caption: data?.variants?.subtitle ?? undefined,
+    title: data?.variants?.title ?? undefined,
+    team: data?.variants?.teams ?? undefined,
+  };
+  return Variant ? <Variant {...props} /> : null;
+};
+
+Team.displayName = displayName;

package/src/team_a.tsx

@@ -0,0 +1,77 @@
+import React from "react";
+import { Avatar } from "@stackshift-ui/avatar";
+import { Card } from "@stackshift-ui/card";
+import { Heading } from "@stackshift-ui/heading";
+import { Text } from "@stackshift-ui/text";
+import { Section } from "@stackshift-ui/section";
+import { Container } from "@stackshift-ui/container";
+import { Flex } from "@stackshift-ui/flex";
+import { Team as iTeam } from "./types";
+import { MemberTextProps, TeamsProps } from ".";
+
+export default function Team_A({ caption, title, team }: TeamsProps) {
+  return (
+    <Section className="py-20 bg-background">
+      <Container maxWidth={1000}>
+        <Container maxWidth={576} className="mb-10 text-center">
+          <CaptionAndTitle caption={caption} title={title} />
+        </Container>
+        <Teams team={team} />
+      </Container>
+    </Section>
+  );
+}
+
+function CaptionAndTitle({ caption, title }: { caption?: string; title?: string }) {
+  return (
+    <React.Fragment>
+      {caption ? (
+        <Text weight="bold" className="text-secondary">
+          {caption}
+        </Text>
+      ) : null}
+      {title ? (
+        <Heading type="h2" fontSize="2xl">
+          {title}
+        </Heading>
+      ) : null}
+    </React.Fragment>
+  );
+}
+
+function Teams({ team }: { team?: iTeam[] }) {
+  if (!team) return null;
+
+  return (
+    <Flex wrap>
+      {team?.map(member => (
+        <div className="w-full px-3 mb-6 md:w-1/2 lg:w-1/3" key={member?.name}>
+          <Card className="py-24 text-center">
+            {member?.mainImage?.image && (
+              <Avatar
+                className="mx-auto border-0"
+                size={96}
+                alt={member?.mainImage?.alt ?? `team-member-${member?.name}-profile-image`}
+                src={`${member?.mainImage?.image}`}
+              />
+            )}
+            <TeamMemberText member={member} />
+          </Card>
+        </div>
+      ))}
+    </Flex>
+  );
+}
+
+function TeamMemberText({ member }: MemberTextProps) {
+  return (
+    <React.Fragment>
+      <Heading type="h3" className="mb-2 text-xl lg:text-2xl">
+        {member?.name}
+      </Heading>
+      <Text muted>{member?.jobTitle}</Text>
+    </React.Fragment>
+  );
+}
+
+export { Team_A };

package/src/team_b.tsx

@@ -0,0 +1,128 @@
+import { Button } from "@stackshift-ui/button";
+import { Card } from "@stackshift-ui/card";
+import { Container } from "@stackshift-ui/container";
+import { Flex } from "@stackshift-ui/flex";
+import { Image } from "@stackshift-ui/image";
+import { Section } from "@stackshift-ui/section";
+import { Text } from "@stackshift-ui/text";
+import React from "react";
+import { MemberTextProps, TeamsProps } from ".";
+import { Team as iTeam } from "./types";
+
+export default function Team_B({ team }: TeamsProps) {
+  const [activeTab, setActiveTab] = React.useState<string | undefined>(team?.[0]?.name);
+
+  const filteredMembers = React.useMemo(
+    () => team?.filter(member => member?.name === activeTab) || [],
+    [team, activeTab],
+  );
+
+  return (
+    <Section className="py-20 bg-background">
+      <Container maxWidth={1280}>
+        <Flex wrap align="center">
+          <TeamTabs team={team} activeTab={activeTab} setActiveTab={setActiveTab} />
+          <TeamMembersList members={filteredMembers} />
+        </Flex>
+      </Container>
+    </Section>
+  );
+}
+
+interface TeamTabsProps {
+  team?: iTeam[];
+  activeTab?: string;
+  setActiveTab: (name: string) => void;
+}
+
+function TeamTabs({ team, activeTab, setActiveTab }: TeamTabsProps) {
+  return (
+    <div className="w-full px-3 mb-8 lg:mb-0 lg:w-1/3">
+      <Flex
+        as="ul"
+        wrap
+        justify="center"
+        direction="row"
+        className="space-x-6 lg:flex-col lg:justify-start lg:space-x-0">
+        {team?.map(item => (
+          <TeamTab key={item.name} data={item} activeTab={activeTab} setActiveTab={setActiveTab} />
+        ))}
+      </Flex>
+    </div>
+  );
+}
+
+interface TeamTabProps {
+  data?: iTeam;
+  activeTab?: string;
+  setActiveTab: (name: string) => void;
+}
+
+function TeamTab({ data, activeTab, setActiveTab }: TeamTabProps) {
+  if (!data || !data.name) return null;
+
+  return (
+    <li>
+      <Button
+        as="button"
+        variant="unstyled"
+        ariaLabel={data.name}
+        className={`mb-4 text-xl lg:text-2xl ${
+          data.name === activeTab ? "text-gray-900" : "text-gray-500"
+        } font-bold hover:text-gray-500 focus:outline-none`}
+        onClick={() => setActiveTab(data.name ?? "")}>
+        {data.name}
+      </Button>
+    </li>
+  );
+}
+
+function TeamMembersList({ members }: { members?: iTeam[] }) {
+  if (!members) return null;
+
+  return (
+    <div className="w-full px-3 lg:w-2/3">
+      {members.map((member, index) => (
+        <TeamMemberCard key={index} member={member} />
+      ))}
+    </div>
+  );
+}
+
+function TeamMemberCard({ member }: { member?: iTeam }) {
+  if (!member) return null;
+
+  return (
+    <Card className="flex p-6 bg-white">
+      {member.mainImage?.image && (
+        <Image
+          className="object-cover overflow-hidden rounded-global"
+          src={`${member.mainImage.image}`}
+          sizes="100vw"
+          width={329}
+          height={494}
+          alt={member.mainImage.alt ?? `team-member-${member.name}-profile-image`}
+        />
+      )}
+      <TeamMmeberText member={member} />
+    </Card>
+  );
+}
+
+function TeamMmeberText({ member }: MemberTextProps) {
+  return (
+    <div className="order-last w-1/2 pt-6 pl-6 mt-6">
+      <Text weight="bold" fontSize="2xl">
+        {member.name}
+      </Text>
+      <Text className="mb-6" muted>
+        {member.jobTitle}
+      </Text>
+      <Text className="mb-6 text-justify" muted>
+        {member.plainText}
+      </Text>
+    </div>
+  );
+}
+
+export { Team_B };

package/src/team_c.tsx

@@ -0,0 +1,75 @@
+import { Card } from "@stackshift-ui/card";
+import { Container } from "@stackshift-ui/container";
+import { Flex } from "@stackshift-ui/flex";
+import { Heading } from "@stackshift-ui/heading";
+import { Image } from "@stackshift-ui/image";
+import { Section } from "@stackshift-ui/section";
+import { Text } from "@stackshift-ui/text";
+import React from "react";
+import { MemberTextProps, TeamsProps } from ".";
+import { Team as iTeam } from "./types";
+
+export default function Team_C({ caption, title, team }: TeamsProps) {
+  return (
+    <Section className="py-20 bg-background">
+      <Container maxWidth={1280}>
+        <CaptionAndTitle caption={caption} title={title} />
+        <TeamMemberCard team={team} />
+      </Container>
+    </Section>
+  );
+}
+
+function CaptionAndTitle({ caption, title }: { caption?: string; title?: string }) {
+  return (
+    <Container maxWidth={576} className="mb-12 text-center ">
+      {caption && (
+        <Text weight="bold" className="text-primary">
+          {caption}
+        </Text>
+      )}
+      {title && <Heading>{title}</Heading>}
+    </Container>
+  );
+}
+
+function TeamMemberCard({ team }: { team?: iTeam[] }) {
+  if (!team) return null;
+
+  return (
+    <Flex wrap>
+      {team.map(member => (
+        <div className="w-full px-3 mb-6 md:w-1/2 lg:w-1/3" key={member?.name}>
+          <Card className="w-full p-0 pb-8 overflow-hidden text-center">
+            {member.mainImage?.image && (
+              <div>
+                <Image
+                  className="mb-8 h-[345px] w-full object-cover rounded-global"
+                  sizes="100vw"
+                  src={`${member?.mainImage?.image}`}
+                  width={345}
+                  height={256}
+                  alt={member?.mainImage?.alt ?? `team-member-${member?.name}-profile-image`}
+                />
+              </div>
+            )}
+            <TeamMemberText member={member} />
+          </Card>
+        </div>
+      ))}
+    </Flex>
+  );
+}
+
+function TeamMemberText({ member }: MemberTextProps) {
+  return (
+    <React.Fragment>
+      <Text fontSize="2xl" weight="bold" className="mb-2">
+        {member?.name}
+      </Text>
+      <Text muted>{member?.jobTitle}</Text>
+    </React.Fragment>
+  );
+}
+
+export { Team_C };

package/src/team_d.tsx

@@ -0,0 +1,77 @@
+import { Card } from "@stackshift-ui/card";
+import { Container } from "@stackshift-ui/container";
+import { Flex } from "@stackshift-ui/flex";
+import { Heading } from "@stackshift-ui/heading";
+import { Image } from "@stackshift-ui/image";
+import { Section } from "@stackshift-ui/section";
+import { Text } from "@stackshift-ui/text";
+import { MemberTextProps, TeamsProps } from ".";
+import { Team as iTeam } from "./types";
+
+export default function Team_D({ caption, title, team }: TeamsProps) {
+  return (
+    <Section className="py-20 bg-background">
+      <Container maxWidth={1280}>
+        <CaptionAndTitle caption={caption} title={title} />
+        <TeamMemberCard team={team} />
+      </Container>
+    </Section>
+  );
+}
+
+function CaptionAndTitle({ caption, title }: { caption?: string; title?: string }) {
+  return (
+    <Container maxWidth={576} className="mb-8 text-center lg:mb-16">
+      {caption && (
+        <Text weight="bold" className="text-secondary">
+          {caption}
+        </Text>
+      )}
+      {title && <Heading>{title}</Heading>}
+    </Container>
+  );
+}
+
+function TeamMemberCard({ team }: { team?: iTeam[] }) {
+  if (!team) return null;
+
+  return (
+    <Flex wrap>
+      {team &&
+        team.map((member, index) => (
+          <div className="w-full px-4 mb-6 lg:w-1/2" key={index}>
+            <Card className="items-center p-0 overflow-hidden sm:flex sm:flex-wrap lg:block xl:flex">
+              {member.mainImage?.image && (
+                <div>
+                  <Image
+                    className="h-[320px] w-full object-cover rounded-global sm:w-[179px] lg:w-full xl:w-[179px]"
+                    sizes="100vw"
+                    src={`${member?.mainImage?.image}`}
+                    width={179}
+                    height={320}
+                    alt={member?.mainImage?.alt ?? `team-member-${member?.name}-profile-image`}
+                  />
+                </div>
+              )}
+              <TeamMemberText member={member} />
+            </Card>
+          </div>
+        ))}
+    </Flex>
+  );
+}
+
+function TeamMemberText({ member }: MemberTextProps) {
+  return (
+    <div className="p-4 sm:w-2/3 lg:w-full lg:pl-6 xl:w-2/3">
+      <Text weight="bold" fontSize="2xl" className="mb-2">
+        {member?.name}
+      </Text>
+      <Text className="mb-4 leading-loose" muted>
+        {member?.plainText}
+      </Text>
+    </div>
+  );
+}
+
+export { Team_D };

package/src/types.ts

@@ -0,0 +1,412 @@
+export type StyleVariants<T extends string> = Record<T, string>;
+
+export type Socials = "facebook" | "instagram" | "youtube" | "linkedin" | "twitter";
+export interface MainImage {
+  image: string;
+  alt?: string;
+}
+
+export interface LabeledRoute extends ConditionalLink {
+  ariaLabel?: string;
+  label?: string;
+  linkTarget?: string;
+  linkType?: string;
+  _type?: string;
+  linkInternal?: any;
+}
+export interface ConditionalLink {
+  type?: string;
+  internalLink?: string | null;
+  externalLink?: string | null;
+}
+
+export interface StatItems {
+  label?: string;
+  mainImage?: MainImage;
+  value?: string;
+  _key?: string;
+  _type?: string;
+}
+
+export interface Logo extends ConditionalLink {
+  alt?: string;
+  linkTarget?: string;
+  image?: string;
+}
+
+export interface Images {
+  image?: string;
+  _key?: string;
+  _type?: string;
+  alt?: string;
+}
+
+export interface ContactDetails {
+  addressInfo?: string;
+  contactInfo?: string;
+  emailInfo?: string;
+  _key?: string;
+}
+
+export interface SocialLink {
+  socialMedia?: string | null;
+  socialMediaLink?: string | null;
+  _key?: string | null;
+  _type?: string | null;
+  socialMediaIcon?: {
+    alt?: string;
+    image?: string;
+  } | null;
+  socialMediaPlatform?: string | null;
+}
+
+export interface LabeledRouteWithKey extends LabeledRoute {
+  _key?: string;
+}
+
+export interface ArrayOfImageTitleAndText {
+  mainImage?: {
+    alt?: string;
+    image?: string;
+  };
+  plainText?: string;
+  title?: string;
+  _key?: string;
+  _type?: string;
+}
+
+export interface FeaturedItem {
+  description?: string;
+  mainImage?: MainImage;
+  title?: string;
+  subtitle?: string;
+  _key?: string;
+  _type?: string;
+}
+
+export interface ArrayOfTitleAndText {
+  _key?: string;
+  plainText?: string;
+  title?: string;
+}
+
+export interface BlogPost extends SanityBody {
+  authors?: Author[] | null;
+  body?: any;
+  categories?: Category[] | null;
+  excerpt?: string | null;
+  link?: string | null;
+  mainImage?: string | null;
+  publishedAt?: string;
+  seo?: Seo | null;
+  slug?: SanitySlug | null;
+  title?: string;
+}
+
+export interface Seo {
+  _type?: string;
+  seoTitle?: string;
+  seoDescription?: string;
+  seoImage?: string;
+  seoKeywords?: string;
+  seoSynonyms?: string;
+}
+
+export interface SanitySlug {
+  current?: string;
+  _type?: "slug";
+}
+
+export interface SanityBody {
+  _createdAt?: string;
+  _id?: string;
+  _rev?: string;
+  _type?: string;
+  _updatedAt?: string;
+}
+
+export interface Author extends SanityBody {
+  link?: string | null;
+  bio?: string | null;
+  name?: string | null;
+  slug?: SanitySlug | null;
+  image?: string | null;
+  profile?: {
+    alt: string;
+    image: string;
+  } | null;
+}
+
+export interface Category extends SanityBody {
+  title?: string;
+}
+
+export interface Form {
+  id?: string | null;
+  buttonLabel?: string | null;
+  name?: string | null;
+  subtitle?: string | null;
+  fields?: FormFields[] | null;
+  thankYouPage?: ThankYouPage | null;
+}
+
+export interface FormFields {
+  name?: string;
+  placeholder?: string;
+  pricingType?: string;
+  type?: FormTypes;
+  _key?: string;
+  _type?: string;
+  isRequired?: boolean;
+  label?: string;
+  items?: string[];
+}
+
+export type FormTypes =
+  | "inputText"
+  | "inputEmail"
+  | "inputPassword"
+  | "inputNumber"
+  | "textarea"
+  | "inputFile"
+  | "inputRadio"
+  | "inputCheckbox"
+  | "inputSelect";
+
+export interface ThankYouPage {
+  externalLink?: string | null;
+  internalLink?: string | null;
+  linkInternal?: any;
+  linkTarget?: string;
+  linkType?: string;
+  type?: string;
+}
+
+//Used on different sections
+export interface SectionsProps {
+  template?: Template;
+  data?: Sections;
+  variant?: string | null | undefined;
+  schema?: Variants;
+}
+
+export interface Sections extends SanityBody {
+  label?: string;
+  variant?: string;
+  variants?: Variants;
+  _key?: string;
+}
+
+//*EDIT THIS SECTION WHEN CREATING/UPDATING SCHEMAS ON STUDIO */
+export interface Variants {
+  template?: Template;
+  multipleMenus?: any;
+  arrayOfTitleAndText?: ArrayOfTitleAndText[] | null;
+  logo?: Logo | null;
+  primaryButton?: LabeledRoute | null;
+  secondaryButton?: LabeledRoute | null;
+  routes?: LabeledRouteWithKey[] | null;
+  menu?: LabeledRouteWithKey[] | null;
+  plans?: Plans[] | null;
+  formLinks?: LabeledRouteWithKey[] | null;
+  portfolios?: Portfolios[] | null;
+  portfoliosWithCategories?: PortfoliosWithCategories[] | null;
+  length?: number;
+  signInLink?: LabeledRoute | null;
+  signinLink?: LabeledRoute | null;
+  tags?: string[] | null;
+  posts?: BlogPost[] | null;
+  blogsPerPage?: number | null;
+  form?: Form | null;
+  collections?: Collection | null;
+  products?: CollectionProduct | null;
+  allProducts?: Collection[];
+  subtitle?: string | null;
+  caption?: string | null;
+  title?: string | null;
+  plainText?: string | null;
+  contactDescription?: string | null;
+  officeInformation?: string | null;
+  contactEmail?: string | null;
+  contactNumber?: string | null;
+  socialLinks?: SocialLink[] | null;
+  block?: any;
+  heading?: string | null;
+  acceptButtonLabel?: string | null;
+  declineButtonLabel?: string | null;
+  faqsWithCategories?: FaqsWithCategory[] | null;
+  faqs?: AskedQuestion[] | null;
+  arrayOfImageTitleAndText?: ArrayOfImageTitleAndText[] | null;
+  description?: string | null;
+  featuredItems?: FeaturedItem[] | null;
+  images?: Images[] | null;
+  contactDetails?: ContactDetails[] | null;
+  copyright?: string | null;
+  mainImage?: MainImage | null;
+  youtubeLink?: string | null;
+  banner?: any;
+  stats?: StatItems[] | null;
+  teams?: Team[] | null;
+  testimonials?: Testimonial[] | null;
+  selectStripeAccount?: string;
+  annualBilling?: string;
+  monthlyBilling?: string;
+  productDetails?: ProductDetail[];
+  btnLabel?: string;
+  selectAccount?: string;
+  hashtags?: string[];
+  numberOfPosts?: number;
+  text?: string;
+  button?: LabeledRoute;
+  features?: string[];
+  config?: {
+    enableAnalytics: boolean;
+    cookiePolicy?: {
+      siteName: string;
+      cookiePolicyPage: Reference;
+    };
+    consentModalPosition?: string;
+  };
+  contactLink?: LabeledRoute;
+}
+
+export interface Template {
+  bg?: string;
+  color?: string;
+}
+
+export type Plans = {
+  _key?: string | null;
+  _type?: "planItems" | null;
+  checkoutButtonName?: string | null;
+  description?: string | null;
+  monthlyPrice?: string | null;
+  planType?: string | null;
+  yearlyPrice?: string | null;
+  planIncludes?: string[] | null;
+  primaryButton?: LabeledRoute | null;
+} & Record<string, string>;
+
+export interface Portfolios {
+  dateAdded?: string | null;
+  mainImage?: {
+    image?: string | null;
+    alt?: string | null;
+  } | null;
+  primaryButton?: LabeledRoute | null;
+  title?: string | null;
+  _key?: string | null;
+  _type?: string | null;
+}
+
+export interface PortfoliosWithCategories {
+  category?: string | null;
+  content?: Content[] | null;
+  primaryButton?: LabeledRoute | null;
+  _key?: string | null;
+  _type?: string | null;
+}
+
+export interface Content extends Portfolios {
+  description?: string | null;
+  subtitle?: string | null;
+}
+
+export interface Collection extends SanityBody {
+  collectionInfoVariant?: {
+    variant?: string;
+  } | null;
+  name?: string | null;
+  products?: CollectionProduct[] | null;
+  sections?: any; //todo
+  seo?: Seo | null;
+  slug?: SanitySlug | null;
+}
+
+export interface CollectionProduct extends SanityBody {
+  compareToPrice?: number | null;
+  description?: string | null;
+  ecwidProductId?: number | null;
+  name?: string | null;
+  price?: number | null;
+  productInfo?: ProductInfo | null;
+  productInfoVariant?: {
+    variant?: string;
+  } | null;
+  sections?: any; //todo
+  seo?: Seo | null;
+  slug?: SanitySlug | null;
+}
+
+//TODO, RECHECK PRODUCT INFO DATA FROM SANITY
+interface ProductInfo {
+  btnLabel?: string | null;
+  images?: ProductInfoImage[] | null;
+  productDetails?: ProductDetail[] | null;
+  socialLinks?: SocialLink[] | null;
+  subtitle?: string | null;
+}
+
+//TODO, RECHECK PRODUCT INFO DATA FROM SANITY
+export interface ProductDetail {
+  blockContent?: any;
+  contentType?: string;
+  tabName?: string;
+  _key?: string;
+  [key: string]: any;
+}
+interface ProductInfoImage {
+  alt?: string | null;
+  _key: string;
+  _type: string;
+  image?: string | null;
+}
+
+export interface FaqsWithCategory {
+  askedQuestions?: AskedQuestion[] | null;
+  category?: string | null;
+  _key?: string;
+  _type?: string;
+}
+
+export interface AskedQuestion {
+  answer?: string | null;
+  question?: string | null;
+  hidden?: boolean;
+  _key?: string;
+  _type?: string;
+}
+
+export interface Team {
+  jobTitle?: string;
+  mainImage?: MainImage;
+  name?: string;
+  plainText?: string;
+  _key?: string;
+  _type?: string;
+}
+
+export interface Testimonial {
+  jobTitle?: string;
+  mainImage?: MainImage;
+  name?: string;
+  rating?: string;
+  testimony?: string;
+  _key?: string;
+  _type?: string;
+}
+
+export declare interface Reference {
+  _type: string;
+  _ref: string;
+  _key?: string;
+  _weak?: boolean;
+  _strengthenOnPublish?: {
+    type: string;
+    weak?: boolean;
+    template?: {
+      id: string;
+      params: Record<string, string | number | boolean>;
+    };
+  };
+}