neba 1.0.0 → 1.2.0

package/dist/types.d.ts

@@ -38,6 +38,19 @@ export type NebaSide = 'top' | 'right' | 'bottom' | 'left';
  * is the whole reason the library never says `left`.
  */
 export type NebaAlign = 'start' | 'center' | 'end';
+/**
+ * How a bar sits in the page's scroll.
+ *
+ * The three CSS `position` values that mean something for a bar, spelled the
+ * way CSS spells them — this is one of the few ideas where inventing a nicer
+ * word (`pinned`, `floating`) would only make a reader look up which CSS it
+ * maps to. Toolbar and Pill both read it.
+ *
+ * - `static` — in the flow, scrolling away with the content.
+ * - `sticky` — in the flow until the edge, then held there.
+ * - `fixed` — out of the flow entirely, against the viewport.
+ */
+export type NebaPosition = 'static' | 'sticky' | 'fixed';
 /**
  * Which corner of a box something is pinned to. Badge reads this.
  *
@@ -47,6 +60,58 @@ export type NebaAlign = 'start' | 'center' | 'end';
  * let a caller spell `{ vertical: 'left' }`.
  */
 export type NebaCorner = 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end';
+/**
+ * Which day a week starts on, counted the way `Date.prototype.getDay` counts it:
+ * Sunday is `0`, Saturday is `6`.
+ *
+ * A number rather than `'sunday' | 'monday' | …`, and for once not because the
+ * number is shorter. Every date API in the platform already speaks this
+ * encoding, so a caller computing the value rather than typing it in — from a
+ * user setting, from `Intl`, from a row in a database — has nothing to translate.
+ * The pickers default it from the locale, so it is rarely written down at all.
+ */
+export type NebaWeekday = 0 | 1 | 2 | 3 | 4 | 5 | 6;
+/**
+ * The viewport widths the layout components branch on, smallest first.
+ *
+ * Deliberately the same five names as `NebaSize`, and deliberately *not* the
+ * same idea: a `size` of `md` is how big a control is, a breakpoint of `md` is
+ * how wide the window is. They share a spelling because a caller who has
+ * learned one ladder should not have to learn a second set of words for the
+ * other, and because every CSS framework worth copying already spells them this
+ * way.
+ *
+ * The widths are Tailwind's own defaults — `sm` 40rem, `md` 48rem, `lg` 64rem,
+ * `xl` 80rem — so a Neba grid and a `md:` utility change at the same moment.
+ * `xs` is 0: it is the value with no media query around it.
+ */
+export type NebaBreakpoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/**
+ * A value that may differ per breakpoint.
+ *
+ * A bare value applies from `xs` up; a partial map applies each entry from its
+ * own breakpoint up, so `{ xs: 12, md: 6 }` is full width until 48rem and half
+ * from there on. There is no `NebaBreakpoint` that means "only at this width" —
+ * every entry is a floor, which is what makes a two-entry map enough to
+ * describe most layouts.
+ */
+export type NebaResponsive<T> = T | Partial<Record<NebaBreakpoint, T>>;
+/**
+ * How a row distributes the space it has left over along its main axis.
+ *
+ * The three positional values are `NebaAlign`'s — logical, so they flip under
+ * RTL — and the three distribution values keep their CSS spelling, because
+ * `space-between` is what the property is called and inventing `between` would
+ * be a second name for something that already has one.
+ */
+export type NebaJustifyContent = NebaAlign | 'space-between' | 'space-around' | 'space-evenly' | 'stretch';
+/**
+ * How items sit across the axis they are laid out on. `stretch` is the default
+ * everywhere it is offered: a row of cards is a row of cards of one height.
+ */
+export type NebaAlignItems = NebaAlign | 'stretch' | 'baseline';
+/** The same, for one item overriding the row around it. */
+export type NebaAlignSelf = NebaAlignItems | 'auto';
 /**
  * Visual weight of a component's surface.
  *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neba",
-  "version": "1.0.0",
+  "version": "1.2.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",
@@ -15,15 +15,16 @@
     "url": "https://github.com/jooy2/neba/issues"
   },
   "scripts": {
-    "build": "npm run format:fix && tsc --project tsconfig.prod.json && npm run minify && node scripts/copy-styles.mjs",
+    "build": "npm run format:fix && tsc --project tsconfig.prod.json && npm run minify && node scripts/build-styles.mjs",
     "lint": "eslint . --ext .js,.ts .",
     "lint:fix": "eslint . --ext .js,.ts --fix .",
     "minify": "terser-glob 'dist/**/*.js' --config-file terser.config.json",
     "prepare": "npm run build",
     "format": "prettier .",
     "format:fix": "prettier . --write",
-    "docs:dev": "npm run build && vitepress dev docs",
-    "docs:build": "npm run build && vitepress build docs",
+    "docs:changelog": "node scripts/copy-changelog.mjs",
+    "docs:dev": "npm run build && npm run docs:changelog && vitepress dev docs",
+    "docs:build": "npm run build && npm run docs:changelog && vitepress build docs",
     "docs:serve": "npm run build && npm run docs:build && vitepress serve docs",
     "test": "vitest run",
     "test:watch": "vitest",
@@ -44,7 +45,8 @@
       "module": "./dist/types.js",
       "default": "./dist/types.js"
     },
-    "./styles.css": "./dist/styles.css"
+    "./styles.css": "./dist/styles.css",
+    "./tailwind.css": "./dist/tailwind.css"
   },
   "typesVersions": {
     "*": {
@@ -98,19 +100,20 @@
   "devDependencies": {
     "@eslint/js": "^9.39.1",
     "@tailwindcss/postcss": "^4.3.3",
-    "@types/node": "^26.1.1",
-    "@types/react": "^19.2.17",
-    "@types/react-dom": "^19.2.3",
+    "@types/node": "^26.1.2",
+    "@types/react": "^19.2.18",
+    "@types/react-dom": "^19.2.4",
     "@typescript-eslint/parser": "^8.65.0",
-    "@vitejs/plugin-react-swc": "^4.3.2",
+    "@vitejs/plugin-react-swc": "^4.3.3",
     "@vitest/browser": "^4.1.10",
     "@vitest/browser-playwright": "^4.1.10",
     "eslint": "^9.39.1",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-n": "^18.2.2",
-    "globals": "^17.7.0",
+    "globals": "^17.8.0",
     "jiti": "^2.7.0",
-    "playwright": "^1.61.1",
+    "playwright": "^1.62.1",
+    "postcss": "^8.5.25",
     "prettier": "^3.9.6",
     "prettier-plugin-tailwindcss": "^0.8.1",
     "react": "^19.2.8",
@@ -120,7 +123,7 @@
     "tsx": "^4.23.1",
     "typescript": "^5.9.3",
     "typescript-eslint": "^8.65.0",
-    "vite": "^8.1.5",
+    "vite": "^8.2.0",
     "vitepress": "^1.6.4",
     "vitepress-i18n": "^1.3.5",
     "vitepress-sidebar": "^1.36.1",
@@ -129,5 +132,15 @@
   },
   "dependencies": {
     "@base-ui/react": "^1.6.0"
+  },
+  "peerDependencies": {
+    "@types/react": "^18.0.0 || ^19.0.0",
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@types/react": {
+      "optional": true
+    }
   }
 }