@bubbasfw/ui 0.0.0-stage → 0.2.0

package/dist/tokens.cjs

@@ -0,0 +1,116 @@
+'use strict';
+
+// src/tokens.ts
+var tokens = {
+  brandVersion: "1.0.0",
+  systemVersion: "0.3.0",
+  colors: {
+    blue: "#007CE8",
+    red: "#CC0000",
+    redHover: "#A80000",
+    navy: "#03256C",
+    night: "#001845",
+    ink: "#131B23",
+    muted: "#526075",
+    line: "#D9E8FB",
+    white: "#FFFFFF",
+    gold: "#FED766",
+    disabled: "#F0F2F5",
+    disabledText: "#6B727E"
+  },
+  spacing: { 1: 4, 2: 8, 3: 12, 4: 16, 6: 24, 8: 32, 12: 48, 16: 64 },
+  radius: { control: 4, panel: 12 },
+  touchTarget: { minimum: 44, default: 48 },
+  layout: { maxWidth: 1200, readingWidth: 720, breakpoints: { compact: 640, wide: 960 } },
+  motion: { feedback: 140 },
+  themes: {
+    "light": {
+      "canvas": "#F7F8FA",
+      "surface": "#FFFFFF",
+      "raised": "#FFFFFF",
+      "hover": "#F6F7F9",
+      "selected": "#ECEEF1",
+      "text": "#131B23",
+      "heading": "#03256C",
+      "muted": "#526075",
+      "line": "#E4E6EA",
+      "border": "#637086",
+      "link": "#03256C",
+      "link-hover": "#A80000",
+      "focus": "#03256C",
+      "focus-inner": "#FFFFFF",
+      "accent": "#CC0000",
+      "action-text": "#FFFFFF",
+      "action-border": "#A80000",
+      "disabled-surface": "#F0F2F5",
+      "disabled-text": "#6B727E",
+      "info": "#03256C",
+      "info-surface": "#F1F5FC",
+      "info-border": "#03256C",
+      "success": "#23633F",
+      "success-surface": "#EAF5EF",
+      "success-border": "#23633F",
+      "warning": "#805500",
+      "warning-surface": "#FFF4D6",
+      "warning-border": "#805500",
+      "error": "#B42318",
+      "error-surface": "#FFF0EF",
+      "error-border": "#B42318",
+      "code-surface": "#171717",
+      "code-text": "#FFFFFF",
+      "code-muted": "#B4B4B4",
+      "selection": "#D9E8FB",
+      "selection-text": "#131B23",
+      "scrollbar": "#637086",
+      "scrollbar-track": "#F7F8FA",
+      "shadow-action": "0 3px 8px #CC000024",
+      "shadow-panel": "0 2px 12px #131B2308",
+      "shadow-dialog": "0 20px 100px #00133345"
+    },
+    "dark": {
+      "canvas": "#171717",
+      "surface": "#202020",
+      "raised": "#292929",
+      "hover": "#303030",
+      "selected": "#383838",
+      "text": "#FFFFFF",
+      "heading": "#FFFFFF",
+      "muted": "#B4B4B4",
+      "line": "#3D3D3D",
+      "border": "#858585",
+      "link": "#8DC7FF",
+      "link-hover": "#B8DEFF",
+      "focus": "#FFFFFF",
+      "focus-inner": "#202020",
+      "accent": "#FF9F99",
+      "action-text": "#FFFFFF",
+      "action-border": "#EF817A",
+      "disabled-surface": "#242424",
+      "disabled-text": "#9A9A9A",
+      "info": "#8DC7FF",
+      "info-surface": "#1D2D3D",
+      "info-border": "#8DC7FF",
+      "success": "#8DDBA9",
+      "success-surface": "#183323",
+      "success-border": "#8DDBA9",
+      "warning": "#FED766",
+      "warning-surface": "#3A2E12",
+      "warning-border": "#FED766",
+      "error": "#FFAEA8",
+      "error-surface": "#3D2020",
+      "error-border": "#FFAEA8",
+      "code-surface": "#171717",
+      "code-text": "#FFFFFF",
+      "code-muted": "#B4B4B4",
+      "selection": "#383838",
+      "selection-text": "#FFFFFF",
+      "scrollbar": "#858585",
+      "scrollbar-track": "#171717",
+      "shadow-action": "0 3px 8px #00000040",
+      "shadow-panel": "0 2px 12px #00000020",
+      "shadow-dialog": "0 20px 100px #00000080"
+    }
+  }
+};
+
+exports.tokens = tokens;

package/dist/tokens.d.cts

@@ -0,0 +1,139 @@
+/** Pinned foundations from Bubba's Brand Studio brand release 1.0.0. */
+declare const tokens: {
+    readonly brandVersion: "1.0.0";
+    readonly systemVersion: "0.3.0";
+    readonly colors: {
+        readonly blue: "#007CE8";
+        readonly red: "#CC0000";
+        readonly redHover: "#A80000";
+        readonly navy: "#03256C";
+        readonly night: "#001845";
+        readonly ink: "#131B23";
+        readonly muted: "#526075";
+        readonly line: "#D9E8FB";
+        readonly white: "#FFFFFF";
+        readonly gold: "#FED766";
+        readonly disabled: "#F0F2F5";
+        readonly disabledText: "#6B727E";
+    };
+    readonly spacing: {
+        readonly 1: 4;
+        readonly 2: 8;
+        readonly 3: 12;
+        readonly 4: 16;
+        readonly 6: 24;
+        readonly 8: 32;
+        readonly 12: 48;
+        readonly 16: 64;
+    };
+    readonly radius: {
+        readonly control: 4;
+        readonly panel: 12;
+    };
+    readonly touchTarget: {
+        readonly minimum: 44;
+        readonly default: 48;
+    };
+    readonly layout: {
+        readonly maxWidth: 1200;
+        readonly readingWidth: 720;
+        readonly breakpoints: {
+            readonly compact: 640;
+            readonly wide: 960;
+        };
+    };
+    readonly motion: {
+        readonly feedback: 140;
+    };
+    readonly themes: {
+        readonly light: {
+            readonly canvas: "#F7F8FA";
+            readonly surface: "#FFFFFF";
+            readonly raised: "#FFFFFF";
+            readonly hover: "#F6F7F9";
+            readonly selected: "#ECEEF1";
+            readonly text: "#131B23";
+            readonly heading: "#03256C";
+            readonly muted: "#526075";
+            readonly line: "#E4E6EA";
+            readonly border: "#637086";
+            readonly link: "#03256C";
+            readonly 'link-hover': "#A80000";
+            readonly focus: "#03256C";
+            readonly 'focus-inner': "#FFFFFF";
+            readonly accent: "#CC0000";
+            readonly 'action-text': "#FFFFFF";
+            readonly 'action-border': "#A80000";
+            readonly 'disabled-surface': "#F0F2F5";
+            readonly 'disabled-text': "#6B727E";
+            readonly info: "#03256C";
+            readonly 'info-surface': "#F1F5FC";
+            readonly 'info-border': "#03256C";
+            readonly success: "#23633F";
+            readonly 'success-surface': "#EAF5EF";
+            readonly 'success-border': "#23633F";
+            readonly warning: "#805500";
+            readonly 'warning-surface': "#FFF4D6";
+            readonly 'warning-border': "#805500";
+            readonly error: "#B42318";
+            readonly 'error-surface': "#FFF0EF";
+            readonly 'error-border': "#B42318";
+            readonly 'code-surface': "#171717";
+            readonly 'code-text': "#FFFFFF";
+            readonly 'code-muted': "#B4B4B4";
+            readonly selection: "#D9E8FB";
+            readonly 'selection-text': "#131B23";
+            readonly scrollbar: "#637086";
+            readonly 'scrollbar-track': "#F7F8FA";
+            readonly 'shadow-action': "0 3px 8px #CC000024";
+            readonly 'shadow-panel': "0 2px 12px #131B2308";
+            readonly 'shadow-dialog': "0 20px 100px #00133345";
+        };
+        readonly dark: {
+            readonly canvas: "#171717";
+            readonly surface: "#202020";
+            readonly raised: "#292929";
+            readonly hover: "#303030";
+            readonly selected: "#383838";
+            readonly text: "#FFFFFF";
+            readonly heading: "#FFFFFF";
+            readonly muted: "#B4B4B4";
+            readonly line: "#3D3D3D";
+            readonly border: "#858585";
+            readonly link: "#8DC7FF";
+            readonly 'link-hover': "#B8DEFF";
+            readonly focus: "#FFFFFF";
+            readonly 'focus-inner': "#202020";
+            readonly accent: "#FF9F99";
+            readonly 'action-text': "#FFFFFF";
+            readonly 'action-border': "#EF817A";
+            readonly 'disabled-surface': "#242424";
+            readonly 'disabled-text': "#9A9A9A";
+            readonly info: "#8DC7FF";
+            readonly 'info-surface': "#1D2D3D";
+            readonly 'info-border': "#8DC7FF";
+            readonly success: "#8DDBA9";
+            readonly 'success-surface': "#183323";
+            readonly 'success-border': "#8DDBA9";
+            readonly warning: "#FED766";
+            readonly 'warning-surface': "#3A2E12";
+            readonly 'warning-border': "#FED766";
+            readonly error: "#FFAEA8";
+            readonly 'error-surface': "#3D2020";
+            readonly 'error-border': "#FFAEA8";
+            readonly 'code-surface': "#171717";
+            readonly 'code-text': "#FFFFFF";
+            readonly 'code-muted': "#B4B4B4";
+            readonly selection: "#383838";
+            readonly 'selection-text': "#FFFFFF";
+            readonly scrollbar: "#858585";
+            readonly 'scrollbar-track': "#171717";
+            readonly 'shadow-action': "0 3px 8px #00000040";
+            readonly 'shadow-panel': "0 2px 12px #00000020";
+            readonly 'shadow-dialog': "0 20px 100px #00000080";
+        };
+    };
+};
+type BubbaTokens = typeof tokens;
+
+export { type BubbaTokens, tokens };

package/dist/tokens.d.ts

@@ -0,0 +1,139 @@
+/** Pinned foundations from Bubba's Brand Studio brand release 1.0.0. */
+declare const tokens: {
+    readonly brandVersion: "1.0.0";
+    readonly systemVersion: "0.3.0";
+    readonly colors: {
+        readonly blue: "#007CE8";
+        readonly red: "#CC0000";
+        readonly redHover: "#A80000";
+        readonly navy: "#03256C";
+        readonly night: "#001845";
+        readonly ink: "#131B23";
+        readonly muted: "#526075";
+        readonly line: "#D9E8FB";
+        readonly white: "#FFFFFF";
+        readonly gold: "#FED766";
+        readonly disabled: "#F0F2F5";
+        readonly disabledText: "#6B727E";
+    };
+    readonly spacing: {
+        readonly 1: 4;
+        readonly 2: 8;
+        readonly 3: 12;
+        readonly 4: 16;
+        readonly 6: 24;
+        readonly 8: 32;
+        readonly 12: 48;
+        readonly 16: 64;
+    };
+    readonly radius: {
+        readonly control: 4;
+        readonly panel: 12;
+    };
+    readonly touchTarget: {
+        readonly minimum: 44;
+        readonly default: 48;
+    };
+    readonly layout: {
+        readonly maxWidth: 1200;
+        readonly readingWidth: 720;
+        readonly breakpoints: {
+            readonly compact: 640;
+            readonly wide: 960;
+        };
+    };
+    readonly motion: {
+        readonly feedback: 140;
+    };
+    readonly themes: {
+        readonly light: {
+            readonly canvas: "#F7F8FA";
+            readonly surface: "#FFFFFF";
+            readonly raised: "#FFFFFF";
+            readonly hover: "#F6F7F9";
+            readonly selected: "#ECEEF1";
+            readonly text: "#131B23";
+            readonly heading: "#03256C";
+            readonly muted: "#526075";
+            readonly line: "#E4E6EA";
+            readonly border: "#637086";
+            readonly link: "#03256C";
+            readonly 'link-hover': "#A80000";
+            readonly focus: "#03256C";
+            readonly 'focus-inner': "#FFFFFF";
+            readonly accent: "#CC0000";
+            readonly 'action-text': "#FFFFFF";
+            readonly 'action-border': "#A80000";
+            readonly 'disabled-surface': "#F0F2F5";
+            readonly 'disabled-text': "#6B727E";
+            readonly info: "#03256C";
+            readonly 'info-surface': "#F1F5FC";
+            readonly 'info-border': "#03256C";
+            readonly success: "#23633F";
+            readonly 'success-surface': "#EAF5EF";
+            readonly 'success-border': "#23633F";
+            readonly warning: "#805500";
+            readonly 'warning-surface': "#FFF4D6";
+            readonly 'warning-border': "#805500";
+            readonly error: "#B42318";
+            readonly 'error-surface': "#FFF0EF";
+            readonly 'error-border': "#B42318";
+            readonly 'code-surface': "#171717";
+            readonly 'code-text': "#FFFFFF";
+            readonly 'code-muted': "#B4B4B4";
+            readonly selection: "#D9E8FB";
+            readonly 'selection-text': "#131B23";
+            readonly scrollbar: "#637086";
+            readonly 'scrollbar-track': "#F7F8FA";
+            readonly 'shadow-action': "0 3px 8px #CC000024";
+            readonly 'shadow-panel': "0 2px 12px #131B2308";
+            readonly 'shadow-dialog': "0 20px 100px #00133345";
+        };
+        readonly dark: {
+            readonly canvas: "#171717";
+            readonly surface: "#202020";
+            readonly raised: "#292929";
+            readonly hover: "#303030";
+            readonly selected: "#383838";
+            readonly text: "#FFFFFF";
+            readonly heading: "#FFFFFF";
+            readonly muted: "#B4B4B4";
+            readonly line: "#3D3D3D";
+            readonly border: "#858585";
+            readonly link: "#8DC7FF";
+            readonly 'link-hover': "#B8DEFF";
+            readonly focus: "#FFFFFF";
+            readonly 'focus-inner': "#202020";
+            readonly accent: "#FF9F99";
+            readonly 'action-text': "#FFFFFF";
+            readonly 'action-border': "#EF817A";
+            readonly 'disabled-surface': "#242424";
+            readonly 'disabled-text': "#9A9A9A";
+            readonly info: "#8DC7FF";
+            readonly 'info-surface': "#1D2D3D";
+            readonly 'info-border': "#8DC7FF";
+            readonly success: "#8DDBA9";
+            readonly 'success-surface': "#183323";
+            readonly 'success-border': "#8DDBA9";
+            readonly warning: "#FED766";
+            readonly 'warning-surface': "#3A2E12";
+            readonly 'warning-border': "#FED766";
+            readonly error: "#FFAEA8";
+            readonly 'error-surface': "#3D2020";
+            readonly 'error-border': "#FFAEA8";
+            readonly 'code-surface': "#171717";
+            readonly 'code-text': "#FFFFFF";
+            readonly 'code-muted': "#B4B4B4";
+            readonly selection: "#383838";
+            readonly 'selection-text': "#FFFFFF";
+            readonly scrollbar: "#858585";
+            readonly 'scrollbar-track': "#171717";
+            readonly 'shadow-action': "0 3px 8px #00000040";
+            readonly 'shadow-panel': "0 2px 12px #00000020";
+            readonly 'shadow-dialog': "0 20px 100px #00000080";
+        };
+    };
+};
+type BubbaTokens = typeof tokens;
+
+export { type BubbaTokens, tokens };

package/dist/tokens.js

@@ -0,0 +1,114 @@
+// src/tokens.ts
+var tokens = {
+  brandVersion: "1.0.0",
+  systemVersion: "0.3.0",
+  colors: {
+    blue: "#007CE8",
+    red: "#CC0000",
+    redHover: "#A80000",
+    navy: "#03256C",
+    night: "#001845",
+    ink: "#131B23",
+    muted: "#526075",
+    line: "#D9E8FB",
+    white: "#FFFFFF",
+    gold: "#FED766",
+    disabled: "#F0F2F5",
+    disabledText: "#6B727E"
+  },
+  spacing: { 1: 4, 2: 8, 3: 12, 4: 16, 6: 24, 8: 32, 12: 48, 16: 64 },
+  radius: { control: 4, panel: 12 },
+  touchTarget: { minimum: 44, default: 48 },
+  layout: { maxWidth: 1200, readingWidth: 720, breakpoints: { compact: 640, wide: 960 } },
+  motion: { feedback: 140 },
+  themes: {
+    "light": {
+      "canvas": "#F7F8FA",
+      "surface": "#FFFFFF",
+      "raised": "#FFFFFF",
+      "hover": "#F6F7F9",
+      "selected": "#ECEEF1",
+      "text": "#131B23",
+      "heading": "#03256C",
+      "muted": "#526075",
+      "line": "#E4E6EA",
+      "border": "#637086",
+      "link": "#03256C",
+      "link-hover": "#A80000",
+      "focus": "#03256C",
+      "focus-inner": "#FFFFFF",
+      "accent": "#CC0000",
+      "action-text": "#FFFFFF",
+      "action-border": "#A80000",
+      "disabled-surface": "#F0F2F5",
+      "disabled-text": "#6B727E",
+      "info": "#03256C",
+      "info-surface": "#F1F5FC",
+      "info-border": "#03256C",
+      "success": "#23633F",
+      "success-surface": "#EAF5EF",
+      "success-border": "#23633F",
+      "warning": "#805500",
+      "warning-surface": "#FFF4D6",
+      "warning-border": "#805500",
+      "error": "#B42318",
+      "error-surface": "#FFF0EF",
+      "error-border": "#B42318",
+      "code-surface": "#171717",
+      "code-text": "#FFFFFF",
+      "code-muted": "#B4B4B4",
+      "selection": "#D9E8FB",
+      "selection-text": "#131B23",
+      "scrollbar": "#637086",
+      "scrollbar-track": "#F7F8FA",
+      "shadow-action": "0 3px 8px #CC000024",
+      "shadow-panel": "0 2px 12px #131B2308",
+      "shadow-dialog": "0 20px 100px #00133345"
+    },
+    "dark": {
+      "canvas": "#171717",
+      "surface": "#202020",
+      "raised": "#292929",
+      "hover": "#303030",
+      "selected": "#383838",
+      "text": "#FFFFFF",
+      "heading": "#FFFFFF",
+      "muted": "#B4B4B4",
+      "line": "#3D3D3D",
+      "border": "#858585",
+      "link": "#8DC7FF",
+      "link-hover": "#B8DEFF",
+      "focus": "#FFFFFF",
+      "focus-inner": "#202020",
+      "accent": "#FF9F99",
+      "action-text": "#FFFFFF",
+      "action-border": "#EF817A",
+      "disabled-surface": "#242424",
+      "disabled-text": "#9A9A9A",
+      "info": "#8DC7FF",
+      "info-surface": "#1D2D3D",
+      "info-border": "#8DC7FF",
+      "success": "#8DDBA9",
+      "success-surface": "#183323",
+      "success-border": "#8DDBA9",
+      "warning": "#FED766",
+      "warning-surface": "#3A2E12",
+      "warning-border": "#FED766",
+      "error": "#FFAEA8",
+      "error-surface": "#3D2020",
+      "error-border": "#FFAEA8",
+      "code-surface": "#171717",
+      "code-text": "#FFFFFF",
+      "code-muted": "#B4B4B4",
+      "selection": "#383838",
+      "selection-text": "#FFFFFF",
+      "scrollbar": "#858585",
+      "scrollbar-track": "#171717",
+      "shadow-action": "0 3px 8px #00000040",
+      "shadow-panel": "0 2px 12px #00000020",
+      "shadow-dialog": "0 20px 100px #00000080"
+    }
+  }
+};
+
+export { tokens };

package/package.json

@@ -1,6 +1,87 @@
 {
   "name": "@bubbasfw/ui",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.2.0",
+  "description": "Bubba\u2019s universal React Native and web design system, styled with NativeWind.",
+  "license": "MIT",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "react-native": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "react-native": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      },
+      "default": "./dist/index.js"
+    },
+    "./tokens": {
+      "import": {
+        "types": "./dist/tokens.d.ts",
+        "default": "./dist/tokens.js"
+      },
+      "require": {
+        "types": "./dist/tokens.d.cts",
+        "default": "./dist/tokens.cjs"
+      },
+      "default": "./dist/tokens.js"
+    },
+    "./tailwind-preset": "./tailwind-preset.cjs",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "src",
+    "tailwind-preset.cjs",
+    "README.md",
+    "LICENSE"
+  ],
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/handh-dev/bubbas-ui.git",
+    "directory": "packages/ui"
+  },
+  "homepage": "https://handh-dev.github.io/bubbas-ui/",
+  "keywords": [
+    "react-native",
+    "react-native-web",
+    "expo",
+    "nextjs",
+    "nativewind",
+    "design-system",
+    "bubbas"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "typecheck": "tsc --noEmit",
+    "prepack": "pnpm build"
+  },
+  "dependencies": {
+    "tailwind-merge": "^2.6.1"
+  },
+  "peerDependencies": {
+    "react": "^19.2.3",
+    "react-native": "^0.86.3",
+    "react-native-web": "^0.21.4",
+    "nativewind": "^4.2.7",
+    "tailwindcss": "^3.4.17"
+  },
+  "peerDependenciesMeta": {
+    "react-native-web": {
+      "optional": true
+    }
+  }
+}