neba 0.0.1 → 1.0.0

package/dist/types.d.ts

@@ -0,0 +1,77 @@
+/**
+ * Shared prop vocabulary for every Neba component.
+ *
+ * These names and values are deliberately generic: a `size` of `md` or a
+ * `color` of `primary` has to mean the same thing on a Button, a Chip, a
+ * TextField or a Dialog. Components pick the subset they need from here and
+ * never invent a parallel spelling of the same idea.
+ */
+/** Scale of a component. `md` is the desktop default. */
+export type NebaSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/** Semantic color role. Maps to a token family in `styles.css`. */
+export type NebaColor = 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info';
+/**
+ * How tightly a component packs its content. Only spacing changes — never the
+ * type scale or the control's own height — so a compact and a default control
+ * of the same `size` still line up on a shared baseline.
+ */
+export type NebaDensity = 'default' | 'compact';
+/**
+ * Which way a component runs. `horizontal` everywhere it is offered, because a
+ * vertical control is the exception and an exception should have to be asked
+ * for. Divider, ButtonGroup, RadioGroup and Slider all read this.
+ */
+export type NebaOrientation = 'horizontal' | 'vertical';
+/**
+ * Which edge of an anchor something is placed against. Tooltip reads this, and
+ * so does anything else that hangs a popup off an element.
+ *
+ * Logical rather than physical — `start`/`end` would be wrong here, because a
+ * tooltip above a button is above it in every writing direction.
+ */
+export type NebaSide = 'top' | 'right' | 'bottom' | 'left';
+/**
+ * Where something sits along the axis it is not placed on: a tooltip against
+ * its trigger, a label set into a divider, the content of a table cell.
+ *
+ * `start`/`end` rather than `left`/`right` because these flip under RTL, which
+ * is the whole reason the library never says `left`.
+ */
+export type NebaAlign = 'start' | 'center' | 'end';
+/**
+ * Which corner of a box something is pinned to. Badge reads this.
+ *
+ * Deliberately one word built out of the two the library already has —
+ * `top`/`bottom` from `NebaSide`, `start`/`end` from `NebaAlign` — rather than
+ * a pair of props. A corner is one decision, and splitting it into two would
+ * let a caller spell `{ vertical: 'left' }`.
+ */
+export type NebaCorner = 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end';
+/**
+ * Visual weight of a component's surface.
+ *
+ * - `solid` — filled, carries the color. One per view, for the primary action.
+ * - `outline` — translucent surface with a hairline border. Secondary actions.
+ * - `text` — no surface until hovered. Tertiary/inline actions.
+ */
+export type NebaVariant = 'solid' | 'outline' | 'text';
+/**
+ * How far a surface sits off the page, as a drop shadow.
+ *
+ * `0` is the default everywhere and means flat — the acrylic edge alone is what
+ * separates the control from its background. Raise it only for surfaces that
+ * genuinely float above the content around them. Hovering adds a level and
+ * pressing removes one, so a flat control still answers a press without moving.
+ */
+export type NebaElevation = 0 | 1 | 2 | 3;
+/** Style props shared by most components; spread into their own prop types. */
+export interface NebaStyleProps {
+    /** @default 'solid' */
+    variant?: NebaVariant;
+    /** @default 'md' */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+    /** @default 'default' */
+    density?: NebaDensity;
+}

package/dist/types.js

@@ -0,0 +1,8 @@
+/**
+ * Shared prop vocabulary for every Neba component.
+ *
+ * These names and values are deliberately generic: a `size` of `md` or a
+ * `color` of `primary` has to mean the same thing on a Button, a Chip, a
+ * TextField or a Dialog. Components pick the subset they need from here and
+ * never invent a parallel spelling of the same idea.
+ */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "neba",
-  "version": "0.0.1",
-  "description": "",
+  "version": "1.0.0",
+  "description": "A comprehensive React UI component library — buttons, fields, menus, dialogs, tables and much more — accessible and themeable, sharing one prop vocabulary and a translucent acrylic design language. ESM only, types included, dark mode built in.",
   "type": "module",
   "types": "dist/index.d.ts",
   "author": "CDGet <jooy2.contact@gmail.com>",
@@ -15,7 +15,7 @@
     "url": "https://github.com/jooy2/neba/issues"
   },
   "scripts": {
-    "build": "npm run format:fix && tsc --project tsconfig.prod.json && npm run minify",
+    "build": "npm run format:fix && tsc --project tsconfig.prod.json && npm run minify && node scripts/copy-styles.mjs",
     "lint": "eslint . --ext .js,.ts .",
     "lint:fix": "eslint . --ext .js,.ts --fix .",
     "minify": "terser-glob 'dist/**/*.js' --config-file terser.config.json",
@@ -24,7 +24,10 @@
     "format:fix": "prettier . --write",
     "docs:dev": "npm run build && vitepress dev docs",
     "docs:build": "npm run build && vitepress build docs",
-    "docs:serve": "npm run build && npm run docs:build && vitepress serve docs"
+    "docs:serve": "npm run build && npm run docs:build && vitepress serve docs",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "typecheck": "tsc --project tsconfig.prod.json --noEmit && tsc --project test/tsconfig.json && tsc --project docs/tsconfig.json"
   },
   "engines": {
     "node": ">=18.0.0"
@@ -40,7 +43,8 @@
       "types": "./dist/types.d.ts",
       "module": "./dist/types.js",
       "default": "./dist/types.js"
-    }
+    },
+    "./styles.css": "./dist/styles.css"
   },
   "typesVersions": {
     "*": {
@@ -50,28 +54,80 @@
     }
   },
   "keywords": [
-    "vitepress"
+    "neba",
+    "react",
+    "reactjs",
+    "react-components",
+    "react-ui",
+    "ui",
+    "ui-kit",
+    "ui-library",
+    "ui-components",
+    "component-library",
+    "components",
+    "design-system",
+    "design-language",
+    "frontend",
+    "web",
+    "typescript",
+    "tsx",
+    "esm",
+    "accessible",
+    "accessibility",
+    "a11y",
+    "aria",
+    "wai-aria",
+    "dark-mode",
+    "theming",
+    "responsive",
+    "acrylic",
+    "glass",
+    "glassmorphism",
+    "button",
+    "dialog",
+    "modal",
+    "menu",
+    "select",
+    "combobox",
+    "table",
+    "tabs",
+    "toast",
+    "tooltip",
+    "form"
   ],
   "devDependencies": {
     "@eslint/js": "^9.39.1",
-    "@types/node": "^24.10.1",
-    "@types/react": "^18.3.27",
-    "@typescript-eslint/parser": "^8.48.0",
+    "@tailwindcss/postcss": "^4.3.3",
+    "@types/node": "^26.1.1",
+    "@types/react": "^19.2.17",
+    "@types/react-dom": "^19.2.3",
+    "@typescript-eslint/parser": "^8.65.0",
+    "@vitejs/plugin-react-swc": "^4.3.2",
+    "@vitest/browser": "^4.1.10",
+    "@vitest/browser-playwright": "^4.1.10",
     "eslint": "^9.39.1",
     "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-n": "^17.23.1",
-    "globals": "^16.5.0",
-    "jiti": "^2.6.1",
-    "prettier": "^3.7.2",
-    "terser-glob": "^1.1.0",
-    "tsx": "^4.20.6",
+    "eslint-plugin-n": "^18.2.2",
+    "globals": "^17.7.0",
+    "jiti": "^2.7.0",
+    "playwright": "^1.61.1",
+    "prettier": "^3.9.6",
+    "prettier-plugin-tailwindcss": "^0.8.1",
+    "react": "^19.2.8",
+    "react-dom": "^19.2.8",
+    "tailwindcss": "^4.3.3",
+    "terser-glob": "^1.2.1",
+    "tsx": "^4.23.1",
     "typescript": "^5.9.3",
-    "typescript-eslint": "^8.48.0",
+    "typescript-eslint": "^8.65.0",
+    "vite": "^8.1.5",
     "vitepress": "^1.6.4",
-    "vitepress-i18n": "^1.3.4",
-    "vitepress-sidebar": "^1.33.1"
+    "vitepress-i18n": "^1.3.5",
+    "vitepress-sidebar": "^1.36.1",
+    "vitest": "^4.1.10",
+    "vitest-browser-react": "^2.2.0"
   },
   "dependencies": {
-    "@base-ui-components/react": "^1.0.0-rc.0"
+    "@base-ui/react": "^1.6.0"
   }
 }

package/pnpm-workspace.yaml

@@ -1,2 +0,0 @@
-onlyBuiltDependencies:
-  - esbuild