From 0f3c96c52043ab42a074838cdadfa144331bc9d1 Mon Sep 17 00:00:00 2001 From: Rahul Vyas Date: Sat, 7 Mar 2026 14:13:06 +0530 Subject: [PATCH 1/2] chore: add TypeScript types for support us button component and update dependencies --- package-lock.json | 52 +++++++++++++++ package.json | 5 ++ src/types/index.ts | 155 +++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 212 insertions(+) create mode 100644 src/types/index.ts diff --git a/package-lock.json b/package-lock.json index 157aaba..ab21f33 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "license": "GNU General Public License v3.0", "devDependencies": { "@tailwindcss/postcss": "^4.2.1", + "@types/react": "^19.2.14", "autoprefixer": "^10.4.27", "postcss": "^8.5.6", "tailwindcss": "^4.2.1", @@ -17,6 +18,10 @@ }, "engines": { "node": ">=14" + }, + "peerDependencies": { + "react": "^19.2.4", + "react-dom": "^19.2.4" } }, "node_modules/@alloc/quick-lru": { @@ -353,6 +358,16 @@ "tailwindcss": "4.2.1" } }, + "node_modules/@types/react": { + "version": "19.2.14", + "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.14.tgz", + "integrity": "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w==", + "dev": true, + "license": "MIT", + "dependencies": { + "csstype": "^3.2.2" + } + }, "node_modules/autoprefixer": { "version": "10.4.27", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.27.tgz", @@ -458,6 +473,13 @@ ], "license": "CC-BY-4.0" }, + "node_modules/csstype": { + "version": "3.2.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz", + "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==", + "dev": true, + "license": "MIT" + }, "node_modules/detect-libc": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz", @@ -870,6 +892,36 @@ "dev": true, "license": "MIT" }, + "node_modules/react": { + "version": "19.2.4", + "resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz", + "integrity": "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==", + "license": "MIT", + "peer": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/react-dom": { + "version": "19.2.4", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.4.tgz", + "integrity": "sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==", + "license": "MIT", + "peer": true, + "dependencies": { + "scheduler": "^0.27.0" + }, + "peerDependencies": { + "react": "^19.2.4" + } + }, + "node_modules/scheduler": { + "version": "0.27.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz", + "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==", + "license": "MIT", + "peer": true + }, "node_modules/source-map-js": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", diff --git a/package.json b/package.json index 90f1789..63a7fdf 100644 --- a/package.json +++ b/package.json @@ -38,9 +38,14 @@ }, "devDependencies": { "@tailwindcss/postcss": "^4.2.1", + "@types/react": "^19.2.14", "autoprefixer": "^10.4.27", "postcss": "^8.5.6", "tailwindcss": "^4.2.1", "typescript": "^5.9.3" + }, + "peerDependencies": { + "react": "^19.2.4", + "react-dom": "^19.2.4" } } diff --git a/src/types/index.ts b/src/types/index.ts new file mode 100644 index 0000000..47326a1 --- /dev/null +++ b/src/types/index.ts @@ -0,0 +1,155 @@ +import React from "react"; + +/* ========================= + THEME +========================= */ + +export type theme = "AOSSIE" | "light" | "dark" | "minimal" | "corporate"; + +/* ========================================================= + Button Variant +========================================================= */ + +export type ButtonVariant = "solid" | "outline" | "ghost" | "gradient"; + +/* ========================= + IMAGE TYPE +========================= */ + +export type image = { + src?: string; + alt?: string; +}; + +/* ========================= + HERO SECTION +========================= */ + +export type hero = { + /** Optional hero background image */ + image?: image; + + title: string; + description: string; + + /** Label like: YOU'RE SPONSORING */ + sponsorLabel?: string; +}; + +/* ========================= + PROJECT INFORMATION +========================= */ + +export type projectInformation = { + name: string; + description: string; +}; + +/* ========================= + ORGANIZATION INFORMATION +========================= */ + +export type organizationInformation = { + name: string; + description: string; + + /** Organization logo */ + logo?: image | string; + + projectInformation: projectInformation; +}; + +/* ========================= + SPONSOR TIERS +========================= */ + +export type Tier = "Platinum" | "Gold" | "Silver" | "Bronze"; + +/* ========================= + SPONSOR CARD +========================= */ + +export type sponsor = { + name: string; + + /** Sponsor logo or avatar */ + logo?: string; + + /** Sponsor website */ + link?: string; + + /** Sponsorship tier */ + sponsorshipTier?: Tier; +}; + +/* ========================= + CURRENT SPONSORS +========================= */ + +export type sponsors = sponsor[]; + +/* ========================= + SPONSOR LINKS (CTA) +========================= */ + +export type sponsorLink = { + name: string; + url: string; + icon?: React.ReactNode; + className?: string; + + /** open link in new tab */ + newTab?: boolean; +}; + +/* ========================= + CTA SECTION +========================= */ + +export type CTAsection = { + title: string; + description: string; + sponsorLink: sponsorLink[]; +}; + +/* ========================= + BACKGROUND PATTERNS +========================= */ + +export type pattern = "dots" | "grid" | "stripes" | "none"; + +/* ========================= + SUPPORT US COMPO PROPS +========================= */ + +export interface supportUsButtonProps { + // Theme for the button, can be one of "AOSSIE", "light", "dark", "minimal", or "corporate" + theme?: theme; + + // Optional background pattern for the button, can be one of "dots", "grid", "stripes", or "none" + pattern?: pattern; + + // Information about the hero section, including title, description, sponsor label, and optional background image + Hero: hero; + + // Information about the organization, including name, description, logo, and project information + organizationInformation: organizationInformation; + + // List of current sponsors, each with name, optional logo, link, and sponsorship tier + sponsors: sponsors; + + // Information about the call-to-action section, including title, description, and sponsor links + CTAsection: CTAsection; + + // Optional class name for custom styling + classNames?: { + container?: string; + hero?: string; + organizationInformation?: string; + sponsors?: string; + CTAsection?: string; + }; + + // Optional button variant for styling the call-to-action buttons + ButtonVariant?: ButtonVariant; +} From 644c106258192942fb947a5acb3cf72584b7b12d Mon Sep 17 00:00:00 2001 From: Rahul Vyas Date: Sat, 7 Mar 2026 15:05:52 +0530 Subject: [PATCH 2/2] chore: update TypeScript types for consistency and improve peer dependency versions --- package.json | 4 ++-- src/types/index.ts | 40 ++++++++++++++++++++-------------------- 2 files changed, 22 insertions(+), 22 deletions(-) diff --git a/package.json b/package.json index 63a7fdf..5331847 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "typescript": "^5.9.3" }, "peerDependencies": { - "react": "^19.2.4", - "react-dom": "^19.2.4" + "react": ">=18", + "react-dom": ">=18" } } diff --git a/src/types/index.ts b/src/types/index.ts index 47326a1..3f114d8 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -1,10 +1,10 @@ -import React from "react"; +import type { ReactNode } from "react"; /* ========================= - THEME + Theme ========================= */ -export type theme = "AOSSIE" | "light" | "dark" | "minimal" | "corporate"; +export type Theme = "AOSSIE" | "light" | "dark" | "minimal" | "corporate"; /* ========================================================= Button Variant @@ -16,18 +16,18 @@ export type ButtonVariant = "solid" | "outline" | "ghost" | "gradient"; IMAGE TYPE ========================= */ -export type image = { +export type Image = { src?: string; alt?: string; }; /* ========================= - HERO SECTION + Hero SECTION ========================= */ -export type hero = { - /** Optional hero background image */ - image?: image; +export type Hero = { + /** Optional Hero background Image */ + Image?: Image; title: string; description: string; @@ -54,7 +54,7 @@ export type organizationInformation = { description: string; /** Organization logo */ - logo?: image | string; + logo?: Image | string; projectInformation: projectInformation; }; @@ -95,7 +95,7 @@ export type sponsors = sponsor[]; export type sponsorLink = { name: string; url: string; - icon?: React.ReactNode; + icon?: ReactNode; className?: string; /** open link in new tab */ @@ -106,7 +106,7 @@ export type sponsorLink = { CTA SECTION ========================= */ -export type CTAsection = { +export type CTASection = { title: string; description: string; sponsorLink: sponsorLink[]; @@ -116,7 +116,7 @@ export type CTAsection = { BACKGROUND PATTERNS ========================= */ -export type pattern = "dots" | "grid" | "stripes" | "none"; +export type Pattern = "dots" | "grid" | "stripes" | "none"; /* ========================= SUPPORT US COMPO PROPS @@ -124,13 +124,13 @@ export type pattern = "dots" | "grid" | "stripes" | "none"; export interface supportUsButtonProps { // Theme for the button, can be one of "AOSSIE", "light", "dark", "minimal", or "corporate" - theme?: theme; + Theme?: Theme; // Optional background pattern for the button, can be one of "dots", "grid", "stripes", or "none" - pattern?: pattern; + pattern?: Pattern; - // Information about the hero section, including title, description, sponsor label, and optional background image - Hero: hero; + // Information about the Hero section, including title, description, sponsor label, and optional background Image + hero: Hero; // Information about the organization, including name, description, logo, and project information organizationInformation: organizationInformation; @@ -139,17 +139,17 @@ export interface supportUsButtonProps { sponsors: sponsors; // Information about the call-to-action section, including title, description, and sponsor links - CTAsection: CTAsection; + ctaSection: CTASection; // Optional class name for custom styling classNames?: { container?: string; - hero?: string; + Hero?: string; organizationInformation?: string; sponsors?: string; - CTAsection?: string; + ctaSection?: string; }; // Optional button variant for styling the call-to-action buttons - ButtonVariant?: ButtonVariant; + buttonVariant?: ButtonVariant; }