onecart-ui 0.1.0

package/dist/src/styles/tokens/typography.d.ts

@@ -0,0 +1,138 @@
+export declare const typographyTokens: {
+    display2xl: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    displayXl: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingXl: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingLg: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingMd: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingSm: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingXs: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    heading2xs: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    bodyXl: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    bodyLg: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    bodyMd: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    bodySm: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    labelLg: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    labelMd: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    labelSm: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+};
+export type TypographyTokenMap = typeof typographyTokens;

package/dist/src/theme/ThemeProvider.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+export declare const ThemeContext: React.Context<{}>;
+export declare const ThemeProvider: React.FC<{
+    children: React.ReactNode;
+}>;

package/dist/src/tokens/design-tokens.d.ts

@@ -0,0 +1,54 @@
+export declare const buttonTokens: {
+    primary: {
+        default: string;
+        hover: string;
+        active: string;
+        disabled: string;
+    };
+    secondary: {
+        default: string;
+        hover: string;
+        active: string;
+        disabled: string;
+    };
+    outline: {
+        borderDefault: string;
+        borderHover: string;
+        borderActive: string;
+        text: {
+            default: string;
+            hover: string;
+            active: string;
+            disabled: string;
+        };
+    };
+    ghost: {
+        text: {
+            default: string;
+            hover: string;
+            active: string;
+            disabled: string;
+        };
+    };
+    destructive: {
+        text: {
+            default: string;
+            hover: string;
+            active: string;
+            disabled: string;
+        };
+    };
+    spacing: {
+        none: string | number;
+        cardSm: string;
+        gapMd: string;
+        gapXs: string;
+    };
+    radius: string;
+    typography: {
+        family: string;
+        weightMedium: string | number;
+    };
+    neutralText: string;
+};
+export type ButtonTokenMap = typeof buttonTokens;

package/dist/styles/tokens/typography.d.ts

@@ -0,0 +1,138 @@
+export declare const typographyTokens: {
+    display2xl: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    displayXl: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingXl: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingLg: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingMd: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingSm: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    headingXs: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    heading2xs: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    bodyXl: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    bodyLg: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    bodyMd: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    bodySm: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    labelLg: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    labelMd: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+    labelSm: {
+        fontFamily: string;
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: string;
+        color: string;
+        letterSpacing: string;
+        textDecoration: string;
+    };
+};
+export type TypographyTokenMap = typeof typographyTokens;

package/dist/theme/ThemeProvider.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+export declare const ThemeContext: React.Context<{}>;
+export declare const ThemeProvider: React.FC<{
+    children: React.ReactNode;
+}>;

package/dist/tokens/design-tokens.d.ts

@@ -0,0 +1,54 @@
+export declare const buttonTokens: {
+    primary: {
+        default: string;
+        hover: string;
+        active: string;
+        disabled: string;
+    };
+    secondary: {
+        default: string;
+        hover: string;
+        active: string;
+        disabled: string;
+    };
+    outline: {
+        borderDefault: string;
+        borderHover: string;
+        borderActive: string;
+        text: {
+            default: string;
+            hover: string;
+            active: string;
+            disabled: string;
+        };
+    };
+    ghost: {
+        text: {
+            default: string;
+            hover: string;
+            active: string;
+            disabled: string;
+        };
+    };
+    destructive: {
+        text: {
+            default: string;
+            hover: string;
+            active: string;
+            disabled: string;
+        };
+    };
+    spacing: {
+        none: string | number;
+        cardSm: string;
+        gapMd: string;
+        gapXs: string;
+    };
+    radius: string;
+    typography: {
+        family: string;
+        weightMedium: string | number;
+    };
+    neutralText: string;
+};
+export type ButtonTokenMap = typeof buttonTokens;

package/dist/types/Button.d.ts

@@ -0,0 +1,24 @@
+export type ButtonType = "primary" | "outline" | "ghost" | "destructive";
+export type ButtonSize = "large" | "small";
+export type ButtonState = "default" | "hover" | "active" | "disabled";
+export interface ButtonProps {
+    label: string;
+    type?: ButtonType;
+    size?: ButtonSize;
+    disabled?: boolean;
+    leftIcon?: string;
+    rightIcon?: string;
+    icon?: string;
+    fullWidth?: boolean;
+    ghostUnderline?: boolean;
+    accessibilityLabel?: string;
+    testID?: string;
+    className?: string;
+    style?: React.CSSProperties | Record<string, unknown>;
+    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    onPress?: () => void;
+    onMouseEnter?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    onMouseLeave?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    onMouseUp?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+}

package/dist/types/Typography.d.ts

@@ -0,0 +1,32 @@
+import React from "react";
+export type BodySize = "xl" | "lg" | "md" | "sm";
+export interface BaseTypographyProps {
+    align?: "left" | "center" | "right";
+    color?: string;
+    truncate?: boolean;
+    lineClamp?: number;
+    className?: string;
+    style?: React.CSSProperties | Record<string, unknown>;
+    onClick?: (e: React.MouseEvent<HTMLElement>) => void;
+    testID?: string;
+    children?: React.ReactNode;
+}
+export interface BodyProps extends BaseTypographyProps {
+    size?: BodySize;
+    element?: keyof JSX.IntrinsicElements;
+}
+export type DisplaySize = "2xl" | "xl";
+export interface DisplayProps extends BaseTypographyProps {
+    size?: DisplaySize;
+    element?: keyof JSX.IntrinsicElements;
+}
+export type HeadingSize = "xl" | "lg" | "md" | "sm" | "xs" | "2xs";
+export interface HeadingProps extends BaseTypographyProps {
+    size?: HeadingSize;
+    element?: keyof JSX.IntrinsicElements;
+}
+export type UtilityVariant = "button" | "link" | "caption";
+export interface UtilityProps extends BaseTypographyProps {
+    variant?: UtilityVariant;
+    element?: keyof JSX.IntrinsicElements;
+}

package/package.json

@@ -0,0 +1,102 @@
+{
+  "name": "onecart-ui",
+  "version": "0.1.0",
+  "description": "OneCart UI: Cross-platform design tokens + React & React Native components",
+  "keywords": [
+    "react",
+    "react-native",
+    "design-system",
+    "components",
+    "design-tokens",
+    "cross-platform",
+    "ui",
+    "onecart"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/yourusername/onecart-design-system.git"
+  },
+  "license": "MIT",
+  "author": "OneCart Team",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "react-native": "dist/index.mobile.js",
+  "files": [
+    "dist",
+    "tokens",
+    "README.md"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./mobile": {
+      "react-native": "./dist/index.mobile.js",
+      "import": "./dist/index.mobile.js",
+      "types": "./dist/mobile/index.d.ts"
+    },
+    "./tokens": {
+      "import": "./tokens/tokens.js",
+      "types": "./tokens/tokens.d.ts"
+    },
+    "./tokens/web": {
+      "import": "./tokens/tokens.js",
+      "types": "./tokens/tokens.d.ts"
+    },
+    "./tokens/mobile": {
+      "import": "./tokens/tokens.js",
+      "types": "./tokens/tokens.d.ts"
+    }
+  },
+  "workspaces": [
+    "packages/*",
+    "packages/components/mobile",
+    "apps/*"
+  ],
+  "scripts": {
+    "dev": "turbo run dev --parallel",
+    "build": "turbo run build && npm run copy-dist",
+    "copy-dist": "mkdir -p dist && cp -r packages/components/dist/* dist/ && mkdir -p tokens && cp -r packages/tokens/build/web/* tokens/",
+    "prepublishOnly": "npm run build",
+    "lint": "turbo run lint",
+    "test": "turbo run test",
+    "generate-tokens": "npm --workspace @onecart-ui/tokens run generate-tokens",
+    "components:build": "npm --workspace @onecart-ui/components run build",
+    "storybook": "npm --workspace @onecart-ui/docs run storybook",
+    "storybook:build": "npm --workspace @onecart-ui/docs run build"
+  },
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-native": "^0.74.0"
+  },
+  "peerDependenciesMeta": {
+    "react-native": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "turbo": "^2.1.1",
+    "typescript": "^5.4.0",
+    "rollup": "^4.21.0",
+    "@rollup/plugin-typescript": "^11.1.5",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-commonjs": "^25.0.7",
+    "@rollup/plugin-json": "^6.1.0",
+    "semantic-release": "^22.0.0",
+    "@semantic-release/changelog": "^6.0.3",
+    "@semantic-release/git": "^10.0.1",
+    "@semantic-release/npm": "^11.0.2",
+    "husky": "^9.0.11",
+    "@commitlint/cli": "^19.3.0",
+    "@commitlint/config-conventional": "^19.2.2",
+    "storybook": "^8.1.0"
+  },
+  "packageManager": "npm@10.0.0"
+}

package/tokens/tokens.css

@@ -0,0 +1,7 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+
+}

package/tokens/tokens.d.ts

@@ -0,0 +1,2 @@
+/** Auto-generated token type declarations */
+

package/tokens/tokens.js

@@ -0,0 +1,3 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */