@indra-inter/neobrutalism-components 0.1.0

package/dist/typescript/theme/theme-provider.d.ts

@@ -0,0 +1,8 @@
+import { type PropsWithChildren } from 'react';
+import { type Theme, type ThemeMode } from './theme.js';
+export type ThemeProviderProps = PropsWithChildren<{
+    mode: ThemeMode;
+}>;
+export declare function ThemeProvider({ children, mode }: ThemeProviderProps): import("react").JSX.Element;
+export declare function useTheme(): Theme;
+//# sourceMappingURL=theme-provider.d.ts.map

package/dist/typescript/theme/theme-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-provider.d.ts","sourceRoot":"","sources":["../../../src/theme/theme-provider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,iBAAiB,EACvB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAsB,KAAK,KAAK,EAAE,KAAK,SAAS,EAAE,MAAM,YAAS,CAAC;AAIzE,MAAM,MAAM,kBAAkB,GAAG,iBAAiB,CAAC;IACjD,IAAI,EAAE,SAAS,CAAC;CACjB,CAAC,CAAC;AAEH,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,kBAAkB,+BAMnE;AAED,wBAAgB,QAAQ,IAAI,KAAK,CAEhC"}

package/dist/typescript/theme/theme.d.ts

@@ -0,0 +1,52 @@
+export type ThemeMode = 'light' | 'dark';
+export type Theme = {
+    colors: {
+        background: string;
+        surface: string;
+        popover: string;
+        accent: string;
+        primary: string;
+        primaryHover: string;
+        primaryForeground: string;
+        secondary: string;
+        secondaryForeground: string;
+        destructive: string;
+        destructiveForeground: string;
+        warning: string;
+        success: string;
+        info: string;
+        foreground: string;
+        mutedForeground: string;
+        disabled: string;
+        semanticBorder: string;
+    };
+    border: {
+        color: string;
+        radius: number;
+        width: number;
+    };
+    shadow: {
+        color: string;
+        xsOffset: number;
+        offset: number;
+    };
+    spacing: {
+        xs: number;
+        sm: number;
+        md: number;
+        lg: number;
+    };
+    typography: {
+        xs: number;
+        xsLineHeight: number;
+        xsSmall: number;
+        xsSmallLineHeight: number;
+        sm: number;
+        md: number;
+        lg: number;
+        weight: '500';
+    };
+};
+export declare function createTheme(mode?: ThemeMode): Theme;
+export declare const theme: Theme;
+//# sourceMappingURL=theme.d.ts.map

package/dist/typescript/theme/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/theme/theme.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AAEzC,MAAM,MAAM,KAAK,GAAG;IAClB,MAAM,EAAE;QACN,UAAU,EAAE,MAAM,CAAC;QACnB,OAAO,EAAE,MAAM,CAAC;QAChB,OAAO,EAAE,MAAM,CAAC;QAChB,MAAM,EAAE,MAAM,CAAC;QACf,OAAO,EAAE,MAAM,CAAC;QAChB,YAAY,EAAE,MAAM,CAAC;QACrB,iBAAiB,EAAE,MAAM,CAAC;QAC1B,SAAS,EAAE,MAAM,CAAC;QAClB,mBAAmB,EAAE,MAAM,CAAC;QAC5B,WAAW,EAAE,MAAM,CAAC;QACpB,qBAAqB,EAAE,MAAM,CAAC;QAC9B,OAAO,EAAE,MAAM,CAAC;QAChB,OAAO,EAAE,MAAM,CAAC;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,EAAE,MAAM,CAAC;QACnB,eAAe,EAAE,MAAM,CAAC;QACxB,QAAQ,EAAE,MAAM,CAAC;QACjB,cAAc,EAAE,MAAM,CAAC;KACxB,CAAC;IACF,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IACzD,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC5D,OAAO,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC;IAC5D,UAAU,EAAE;QACV,EAAE,EAAE,MAAM,CAAC;QACX,YAAY,EAAE,MAAM,CAAC;QACrB,OAAO,EAAE,MAAM,CAAC;QAChB,iBAAiB,EAAE,MAAM,CAAC;QAC1B,EAAE,EAAE,MAAM,CAAC;QACX,EAAE,EAAE,MAAM,CAAC;QACX,EAAE,EAAE,MAAM,CAAC;QACX,MAAM,EAAE,KAAK,CAAC;KACf,CAAC;CACH,CAAC;AAEF,wBAAgB,WAAW,CAAC,IAAI,GAAE,SAAmB,GAAG,KAAK,CAoD5D;AAED,eAAO,MAAM,KAAK,OAAuB,CAAC"}

package/package.json

@@ -0,0 +1,88 @@
+{
+  "name": "@indra-inter/neobrutalism-components",
+  "version": "0.1.0",
+  "private": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "./dist/module/index.js",
+  "types": "./dist/typescript/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/typescript/index.d.ts",
+      "default": "./dist/module/index.js"
+    },
+    "./tokens.css": "./tokens.css",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "tokens.css",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "nativewind": ">=4.0.0 <5",
+    "react": ">=19.2.0 <20",
+    "react-native": ">=0.83.0 <0.87",
+    "react-native-safe-area-context": ">=5.0.0 <6",
+    "react-native-screens": ">=4.0.0 <5",
+    "react-native-svg": ">=15.0.0 <16"
+  },
+  "devDependencies": {
+    "@types/react": "~19.2.2",
+    "nativewind": "^4.2.6",
+    "react-native-builder-bob": "^0.43.0",
+    "react-native": "0.83.6",
+    "react-native-safe-area-context": "~5.7.0",
+    "react-native-screens": "~4.26.0",
+    "react-native-svg": "15.15.4",
+    "typescript": "~6.0.3"
+  },
+  "scripts": {
+    "build": "bob build",
+    "generate:design-tokens": "node ./scripts/generate-design-tokens.mjs",
+    "test:badge-nativewind": "node ./scripts/test-badge-nativewind.mjs",
+    "test:card-nativewind": "node ./scripts/test-card-nativewind.mjs",
+    "test:bottom-sheet-drag-dismiss": "node ./scripts/test-bottom-sheet-drag-dismiss.mjs",
+    "test:chat-list-item-slots": "node ./scripts/test-chat-list-item-slots.mjs",
+    "test:design-tokens": "node ./scripts/test-design-tokens.mjs",
+    "test:divider": "node ./scripts/test-divider.mjs",
+    "test:icon-button-ghost": "node ./scripts/test-icon-button-ghost.mjs",
+    "test:input-addon-padding": "node ./scripts/test-input-addon-padding.mjs",
+    "test:list-item-nativewind": "node ./scripts/test-list-item-nativewind.mjs",
+    "test:pin-code-field": "node ./scripts/test-pin-code-field.mjs",
+    "test:tabs-figma-update": "node ./scripts/test-tabs-figma-update.mjs",
+    "prepare": "pnpm build",
+    "typecheck": "tsc --noEmit"
+  },
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "dist",
+    "targets": [
+      [
+        "module",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
+    ]
+  },
+  "dependencies": {
+    "@rn-primitives/dialog": "^1.5.2",
+    "@rn-primitives/dropdown-menu": "^1.5.2",
+    "@rn-primitives/popover": "^1.5.2",
+    "@rn-primitives/portal": "^1.5.3",
+    "@rn-primitives/select": "^1.5.2",
+    "@rn-primitives/toast": "^1.5.2",
+    "libphonenumber-js": "^1.13.12",
+    "lucide-react-native": "^1.34.0",
+    "react-native-calendars": "^1.1314.0",
+    "react-native-confirmation-code-field": "^9.0.0"
+  }
+}

package/tokens.css

@@ -0,0 +1,132 @@
+/* Generated from Figma design tokens. Do not edit by hand. */
+:root {
+  --neo-background: 0 0% 100%;
+  --neo-foreground: 0 0% 3.92%;
+  --neo-card: 0 0% 95.29%;
+  --neo-card-foreground: 0 0% 3.92%;
+  --neo-popover: 0 0% 98.04%;
+  --neo-popover-foreground: 0 0% 3.92%;
+  --neo-primary: 199.84 100% 50.2%;
+  --neo-primary-hover: 200.98 79.89% 64.9%;
+  --neo-primary-foreground: 0 0% 0%;
+  --neo-secondary: 0 0% 3.92%;
+  --neo-secondary-foreground: 0 0% 100%;
+  --neo-muted: 0 0% 94.9%;
+  --neo-muted-foreground: 0 0% 36.08%;
+  --neo-accent: 201.11 100% 89.41%;
+  --neo-accent-foreground: 202.17 79.31% 11.37%;
+  --neo-destructive: 355.49 77.58% 56.27%;
+  --neo-destructive-foreground: 0 0% 100%;
+  --neo-border: 0 0% 0%;
+  --neo-input: 0 0% 100%;
+  --neo-ring: 199.84 100% 50.2%;
+  --neo-shadow-color: 0 0% 4.31%;
+  --neo-sidebar: 0 0% 100%;
+  --neo-sidebar-foreground: 0 0% 3.92%;
+  --neo-sidebar-primary: 199.84 100% 50.2%;
+  --neo-sidebar-primary-foreground: 0 0% 0%;
+  --neo-sidebar-accent: 201.11 100% 89.41%;
+  --neo-sidebar-accent-foreground: 202.17 79.31% 11.37%;
+  --neo-sidebar-border: 0 0% 0%;
+  --neo-sidebar-ring: 199.84 100% 50.2%;
+  --neo-surface: 0 0% 95.29%;
+  --neo-surface-foreground: 0 0% 3.92%;
+  --neo-code: 0 0% 94.9%;
+  --neo-code-foreground: 0 0% 3.92%;
+  --neo-selection: 199.84 100% 50.2%;
+  --neo-selection-foreground: 0 0% 0%;
+  --neo-decor-accent: 199.84 100% 50.2%;
+  --neo-decor-ink: 0 0% 0%;
+  --neo-decor-paper: 0 0% 100%;
+  --neo-background-color: 0 0% 0% / 50.2%;
+  --neo-semantic-background: 0 0% 55.29%;
+  --neo-semantic-border: 0 0.45% 56.27%;
+  --neo-semantic-foreground: 0 0% 100%;
+  --neo-success-100: 140.63 84.21% 92.55%;
+  --neo-success-200: 141 78.95% 85.1%;
+  --neo-success-300: 141.71 76.64% 73.14%;
+  --neo-success-400: 141.89 69.16% 58.04%;
+  --neo-success-500: 142.09 70.56% 45.29%;
+  --neo-info-100: 214.29 94.59% 92.75%;
+  --neo-info-200: 213.33 96.92% 87.25%;
+  --neo-info-300: 211.7 96.36% 78.43%;
+  --neo-info-400: 213.12 93.9% 67.84%;
+  --neo-info-500: 217.22 91.22% 59.8%;
+  --neo-warning-100: 28 100% 97.06%;
+  --neo-warning-200: 26.51 100% 91.57%;
+  --neo-warning-300: 26.84 100% 85.1%;
+  --neo-warning-400: 26.55 100% 77.84%;
+  --neo-warning-500: 26.39 90.22% 63.92%;
+  --neo-error-100: 0 100% 95.88%;
+  --neo-error-200: 0 100% 90.78%;
+  --neo-error-300: 0 100% 82.75%;
+  --neo-error-400: 0 90.14% 72.16%;
+  --neo-error-500: 0 75.25% 60.39%;
+  --neo-error-foreground: 0 75.25% 60.39% / 25.1%;
+}
+
+.dark:root {
+  --neo-background: 0 0% 12.16%;
+  --neo-foreground: 0 0% 98.04%;
+  --neo-card: 0 0% 10.2%;
+  --neo-card-foreground: 0 0% 98.04%;
+  --neo-popover: 0 0% 10.2%;
+  --neo-popover-foreground: 0 0% 98.04%;
+  --neo-primary: 199.84 100% 50.2%;
+  --neo-primary-hover: 200.98 79.89% 64.9%;
+  --neo-primary-foreground: 0 0% 0%;
+  --neo-secondary: 0 0% 98.04%;
+  --neo-secondary-foreground: 0 0% 5.88%;
+  --neo-muted: 0 0% 14.9%;
+  --neo-muted-foreground: 0 0% 63.92%;
+  --neo-accent: 202.5 64.86% 14.51%;
+  --neo-accent-foreground: 201.11 100% 89.41%;
+  --neo-destructive: 0 100% 70.98%;
+  --neo-destructive-foreground: 0 10.64% 9.22%;
+  --neo-border: 0 0% 0%;
+  --neo-input: 200 8.57% 13.73%;
+  --neo-ring: 199.89 100% 65.1%;
+  --neo-shadow-color: 0 0% 23.92%;
+  --neo-sidebar: 0 0% 12.16%;
+  --neo-sidebar-foreground: 0 0% 98.04%;
+  --neo-sidebar-primary: 199.84 100% 50.2%;
+  --neo-sidebar-primary-foreground: 0 0% 0%;
+  --neo-sidebar-accent: 202.5 64.86% 14.51%;
+  --neo-sidebar-accent-foreground: 201.11 100% 89.41%;
+  --neo-sidebar-border: 0 0% 0%;
+  --neo-sidebar-ring: 199.89 100% 65.1%;
+  --neo-surface: 0 0% 10.2%;
+  --neo-surface-foreground: 0 0% 98.04%;
+  --neo-code: 0 0% 14.9%;
+  --neo-code-foreground: 0 0% 98.04%;
+  --neo-selection: 199.84 100% 50.2%;
+  --neo-selection-foreground: 0 0% 0%;
+  --neo-decor-accent: 200.19 46.85% 56.47%;
+  --neo-decor-ink: 0 0% 0%;
+  --neo-decor-paper: 0 0% 100%;
+  --neo-background-color: 0 0% 0% / 50.2%;
+  --neo-semantic-background: 30 2.63% 14.9%;
+  --neo-semantic-border: 210 1.22% 32.16%;
+  --neo-semantic-foreground: 0 0% 100%;
+  --neo-success-100: 140.63 84.21% 92.55%;
+  --neo-success-200: 141 78.95% 85.1%;
+  --neo-success-300: 141.71 76.64% 73.14%;
+  --neo-success-400: 141.89 69.16% 58.04%;
+  --neo-success-500: 142.09 70.56% 45.29%;
+  --neo-info-100: 214.29 94.59% 92.75%;
+  --neo-info-200: 213.33 96.92% 87.25%;
+  --neo-info-300: 211.7 96.36% 78.43%;
+  --neo-info-400: 213.12 93.9% 67.84%;
+  --neo-info-500: 217.22 91.22% 59.8%;
+  --neo-warning-100: 28 100% 97.06%;
+  --neo-warning-200: 26.51 100% 91.57%;
+  --neo-warning-300: 26.84 100% 85.1%;
+  --neo-warning-400: 26.55 100% 77.84%;
+  --neo-warning-500: 26.39 90.22% 63.92%;
+  --neo-error-100: 0 100% 95.88%;
+  --neo-error-200: 0 100% 90.78%;
+  --neo-error-300: 0 100% 82.75%;
+  --neo-error-400: 0 90.14% 72.16%;
+  --neo-error-500: 0 75.25% 60.39%;
+  --neo-error-foreground: 0 75.25% 60.39% / 25.1%;
+}