@borisj74/bv-ds 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 borisj74
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,94 @@
+# @borisj74/bv-ds
+
+React component library synced from Figma (Untitled UI v8.0), built on Tailwind CSS.
+
+## Install
+
+```bash
+npm install @borisj74/bv-ds
+```
+
+Peer dependencies — install alongside the package:
+
+```bash
+npm install react react-dom
+```
+
+If you use chart components, also install:
+
+```bash
+npm install recharts
+```
+
+## Setup
+
+### 1. Add the Tailwind preset
+
+In your app's `tailwind.config.js`:
+
+```js
+const dsPreset = require("@borisj74/bv-ds/tailwind-preset");
+
+module.exports = {
+  presets: [dsPreset],
+  content: [
+    "./src/**/*.{ts,tsx}",
+    // Scan the DS source so Tailwind picks up component class names
+    "./node_modules/@borisj74/bv-ds/src/**/*.{ts,tsx}",
+  ],
+};
+```
+
+### 2. Import the stylesheet
+
+In your app's entry point (e.g. `main.tsx` or `_app.tsx`):
+
+```ts
+import "@borisj74/bv-ds/dist/index.css"; // if generated
+```
+
+### 3. Use components
+
+```tsx
+import { Button, InputField, Toggle, Tooltip } from "@borisj74/bv-ds";
+
+function App() {
+  return (
+    <Button hierarchy="Primary" size="md">
+      Get started
+    </Button>
+  );
+}
+```
+
+## Components
+
+91 components synced from Untitled UI v8.0, including:
+
+- **Buttons** — Button, ButtonDestructive, ButtonUtility, ButtonCloseX, SocialButton
+- **Inputs** — InputField, LeadingInputField, TrailingInputField, TagsInputField, TextareaInputField, VerificationCodeInput, NumberInput, MegaInputFieldBase
+- **Navigation** — SidebarNavigation, HeaderNavigation, NavItemBase, NavButton, NavFeaturedCard, NavAccountCard, Breadcrumbs, Tabs, TabButtonBase
+- **Feedback** — Alert, Notification, Tooltip, LoadingIndicator, ProgressBar, ProgressCircle
+- **Data display** — Badge, Tag, Avatar, StatusIcon, MetricItem, ActivityGauge, LineAndBarChart, Table cells and headers
+- **Overlays** — ContextMenu, DropdownMenu, Select, MultiSelect, DatePicker, FilterBar, Slider, Toggle
+- **Layout** — ContentHeading, ContentParagraph, ContentDivider, SectionHeader, SectionFooter, PageHeader, Modal primitives
+- **Charts** — ActivityGauge, LineAndBarChart (Recharts-based), ChartMini sparkline
+- **Forms** — Checkbox, Radio, RadioGroup, RadioGroupItem, ButtonGroup, Pagination
+
+Full component list and Storybook: [chromatic.com](https://www.chromatic.com)
+
+## Tailwind tokens
+
+Design tokens are available via the preset. Import and use directly in your own components:
+
+```tsx
+// tailwind.config.js preset exposes:
+// Colors: bg-brand-solid, text-secondary, border-primary, fg-quaternary ...
+// Spacing: p-md, gap-xl, px-3xl ...
+// Radius: rounded-md, rounded-full ...
+// Typography: text-sm, text-display-xs ...
+```
+
+## License
+
+MIT © borisj74