@mezo-org/mezo-clay 0.1.0-dev.0

package/dist/themes/color-tokens.d.ts

@@ -0,0 +1,64 @@
+export declare const mezoOffRed = "#FF004D";
+export declare const primitiveColors: {
+    gray300: string;
+    yellow300: string;
+    yellow400: string;
+    yellow500: string;
+    yellow600: string;
+    yellow700: string;
+    lime300: string;
+    lime400: string;
+    lime500: string;
+    lime600: string;
+    lime700: string;
+    purple300: string;
+    purple400: string;
+    purple500: string;
+    purple600: string;
+    purple700: string;
+    blue300: string;
+    blue400: string;
+    blue500: string;
+    blue600: string;
+    blue700: string;
+    brown300: string;
+    brown400: string;
+    brown500: string;
+    brown600: string;
+    brown700: string;
+};
+export declare const coreColors: {
+    accent: string;
+    negative: string;
+    warning: string;
+    positive: string;
+};
+export declare const semanticExtensionColors: {
+    backgroundStateDisabled: string;
+    backgroundOverlayDark: string;
+    backgroundOverlayElevation: string;
+    backgroundAccent: string;
+    backgroundNegative: string;
+    backgroundWarning: string;
+    backgroundPositive: string;
+    backgroundAccentLight: string;
+    backgroundNegativeLight: string;
+    backgroundWarningLight: string;
+    backgroundPositiveLight: string;
+    backgroundAlwaysDark: string;
+    backgroundAlwaysLight: string;
+    contentAccent: string;
+    contentNegative: string;
+    contentWarning: string;
+    contentPositive: string;
+    borderAccent: string;
+    borderAccentLight: string;
+    borderNegative: string;
+    borderWarning: string;
+};
+export declare const sharedComponentColors: {
+    buttonPrimarySpinnerForeground: string;
+    buttonSecondarySpinnerForeground: string;
+    buttonTertiarySpinnerForeground: string;
+    buttonDisabledSpinnerForeground: string;
+};

package/dist/themes/index.d.ts

@@ -0,0 +1,6 @@
+export { BaseProvider, ThemeProvider } from 'baseui';
+export { Provider as StyletronProvider } from 'styletron-react';
+export { default as borders } from './borders';
+export { default as typography } from './typography';
+export { default as ClayLightTheme } from './clay-light-theme';
+export { default as ClayDarkTheme } from './clay-dark-theme';

package/dist/themes/typography.d.ts

@@ -0,0 +1,219 @@
+declare const typography: {
+    DisplayLarge: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    DisplayMedium: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    DisplaySmall: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    DisplayXSmall: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    HeadingXXLarge: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    HeadingXLarge: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    HeadingLarge: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    HeadingMedium: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    HeadingSmall: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    HeadingXSmall: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    LabelLarge: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    LabelMedium: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    LabelSmall: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    LabelXSmall: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    ParagraphLarge: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    ParagraphMedium: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    ParagraphSmall: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    ParagraphXSmall: {
+        fontSize: string;
+        lineHeight: string;
+        fontFamily: string;
+        fontWeight: number;
+    };
+    MonoDisplayLarge: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoDisplayMedium: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoDisplaySmall: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoDisplayXSmall: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoHeadingXXLarge: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoHeadingXLarge: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoHeadingLarge: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoHeadingMedium: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoHeadingSmall: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoHeadingXSmall: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoLabelLarge: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoLabelMedium: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoLabelSmall: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoLabelXSmall: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoParagraphLarge: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoParagraphMedium: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoParagraphSmall: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+    MonoParagraphXSmall: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: string;
+        lineHeight: string;
+    };
+};
+export default typography;

package/dist/utils/index.d.ts

@@ -0,0 +1,2 @@
+export declare function hexToRgba(hex: any, alpha?: any): string;
+export declare function toTitleCase(str?: string): string;

package/package.json

@@ -0,0 +1,69 @@
+{
+  "name": "@mezo-org/mezo-clay",
+  "version": "0.1.0-dev.0",
+  "repository": "git@github.com:mezo-org/clay.git",
+  "main": "./dist/mezo-clay.umd.js",
+  "module": "./dist/mezo-clay.es.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "prettier": "@thesis/prettier-config",
+  "dependencies": {
+    "@storybook/blocks": "^8.4.7",
+    "@storybook/experimental-addon-test": "^8.4.7",
+    "@storybook/preview-api": "^8.4.7",
+    "@storybook/react": "^8.4.7",
+    "@storybook/test": "^8.4.7",
+    "@storybook/theming": "^8.4.7",
+    "@vitejs/plugin-react": "^4.3.4",
+    "baseui": "0.0.0-next-18f01efe0",
+    "storybook-dark-mode": "^4.0.2",
+    "styletron-react": "^6.1.1",
+    "vite": "^6.0.3",
+    "vite-plugin-dts": "^4.3.0",
+    "vitest": "^2.1.8"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^3.2.2",
+    "@storybook/addon-essentials": "^8.4.7",
+    "@storybook/react-vite": "^8.4.7",
+    "@thesis-co/eslint-config": "^0.6.1",
+    "@thesis/prettier-config": "github:thesis/prettier-config",
+    "@types/node": "^22.10.2",
+    "@types/react": "^18.3.1",
+    "@types/react-dom": "18.3.1",
+    "@typescript-eslint/eslint-plugin": "^7.5.0",
+    "@typescript-eslint/parser": "^7.5.0",
+    "@vitest/browser": "^2.1.8",
+    "eslint": "^8.57.0",
+    "eslint-import-resolver-typescript": "^3.7.0",
+    "eslint-plugin-baseui": "^13.0.0",
+    "eslint-plugin-storybook": "^0.11.1",
+    "playwright": "^1.49.1",
+    "prettier": "^3.4.2",
+    "storybook": "^8.4.7",
+    "typescript": "5.5.4",
+    "wrangler": "^3.96.0"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "styletron-engine-monolithic": "^1.0.0"
+  },
+  "scripts": {
+    "dev": "pnpm run storybook",
+    "build": "pnpm run build-storybook",
+    "build:lib": "tsc && vite build",
+    "lint:config": "prettier -c '**/*.@(json|yaml|toml)'",
+    "lint:config:fix": "prettier -w '**/*.@(json|yaml|toml)'",
+    "lint:eslint": "eslint . --ext ts,tsx,mts",
+    "lint:eslint:fix": "eslint . --fix",
+    "format": "pnpm run lint:eslint && pnpm run lint:config",
+    "format:fix": "pnpm run lint:eslint:fix && pnpm run lint:config:fix",
+    "test": "vitest run",
+    "test-watch": "vitest",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  }
+}