@blenx-dev/components 0.0.2 → 0.0.3

package/dist/src/components/Button/button.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function ButtonDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof ButtonDemo;
-}[];

package/dist/src/components/Calendar/calendar.doc.d.ts

@@ -1 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;

package/dist/src/components/Card/card.demo.d.ts

@@ -1,8 +0,0 @@
-export declare function CardDemo(): import("react").JSX.Element;
-export declare function ProfileCardDemo(): import("react").JSX.Element;
-export declare function ProductCardDemo(): import("react").JSX.Element;
-export declare function StatCardDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof CardDemo;
-}[];

package/dist/src/components/Card/card.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare function PaddingVariantsStory(): import("react").JSX.Element;

package/dist/src/components/ColorPicker/color-picker.doc.d.ts

@@ -1 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;

package/dist/src/components/ColorSwatch/color-swatch.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare function SizesStory(): import("react").JSX.Element;

package/dist/src/components/Command/command.demo.d.ts

@@ -1,6 +0,0 @@
-export declare function CommandBasic(): import("react").JSX.Element;
-export declare function CommandWithGroups(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof CommandBasic;
-}[];

package/dist/src/components/Command/command.doc.d.ts

@@ -1,3 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare function WithGroupsStory(): import("react").JSX.Element;
-export declare function WithSelectionStory(): import("react").JSX.Element;

package/dist/src/components/Container/container.doc.d.ts

@@ -1 +0,0 @@
-export declare function SizesStory(): import("react").JSX.Element;

package/dist/src/components/DatePicker/date-picker.doc.d.ts

@@ -1 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;

package/dist/src/components/Dialog/dialog.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function DialogDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof DialogDemo;
-}[];

package/dist/src/components/Dialog/dialog.doc.d.ts

@@ -1 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;

package/dist/src/components/Drawer/drawer.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function DrawerDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof DrawerDemo;
-}[];

package/dist/src/components/Drawer/drawer.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function BottomStory(): import("react").JSX.Element;
-export declare function RightStory(): import("react").JSX.Element;

package/dist/src/components/Field/field.doc.d.ts

@@ -1 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;

package/dist/src/components/Grid/grid.doc.d.ts

@@ -1 +0,0 @@
-export declare function ColumnsStory(): import("react").JSX.Element;

package/dist/src/components/Icon/icon.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function IconDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof IconDemo;
-}[];

package/dist/src/components/IconButton/icon-button.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function IconButtonDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof IconButtonDemo;
-}[];

package/dist/src/components/Input/input.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function InputDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof InputDemo;
-}[];

package/dist/src/components/Input/input.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function SizesStory(): import("react").JSX.Element;
-export declare function StatesStory(): import("react").JSX.Element;

package/dist/src/components/InputGroup/input-group.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof DefaultStory;
-}[];

package/dist/src/components/Menu/menu.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof DefaultStory;
-}[];

package/dist/src/components/OTPField/otp-field.demo.d.ts

@@ -1,6 +0,0 @@
-export declare function OTPFieldDemo(): import("react").JSX.Element;
-export declare function OTPFieldGroupedDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof OTPFieldDemo;
-}[];

package/dist/src/components/Popover/popover.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof DefaultStory;
-}[];

package/dist/src/components/ScrollArea/scroll-area.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare function WithFadeStory(): import("react").JSX.Element;

package/dist/src/components/SegmentedControl/segmented-control.doc.d.ts

@@ -1 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;

package/dist/src/components/Select/select.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function SelectDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof SelectDemo;
-}[];

package/dist/src/components/Select/select.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare function WithLabelStory(): import("react").JSX.Element;

package/dist/src/components/Separator/separator.doc.d.ts

@@ -1,4 +0,0 @@
-export declare function HorizontalStory(): import("react").JSX.Element;
-export declare function VerticalStory(): import("react").JSX.Element;
-export declare function WithLabelStory(): import("react").JSX.Element;
-export declare function TonesStory(): import("react").JSX.Element;

package/dist/src/components/Sheet/sheet.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function SheetDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof SheetDemo;
-}[];

package/dist/src/components/Spinner/spinner.demo.d.ts

@@ -1 +0,0 @@
-export declare function SizesStory(): import("react").JSX.Element;

package/dist/src/components/Stack/stack.doc.d.ts

@@ -1,3 +0,0 @@
-export declare function VStackStory(): import("react").JSX.Element;
-export declare function HStackStory(): import("react").JSX.Element;
-export declare function GapVariantsStory(): import("react").JSX.Element;

package/dist/src/components/Surface/surface.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function VariantsStory(): import("react").JSX.Element;
-export declare function InteractiveStory(): import("react").JSX.Element;

package/dist/src/components/Switch/switch.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function SwitchDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof SwitchDemo;
-}[];

package/dist/src/components/Switch/switch.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare function DisabledStory(): import("react").JSX.Element;

package/dist/src/components/Table/table.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function TableDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof TableDemo;
-}[];

package/dist/src/components/Tabs/tabs.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function TabsDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof TabsDemo;
-}[];

package/dist/src/components/Tabs/tabs.doc.d.ts

@@ -1,3 +0,0 @@
-export declare function UnderlineStory(): import("react").JSX.Element;
-export declare function GhostStory(): import("react").JSX.Element;
-export declare function SegmentedStory(): import("react").JSX.Element;

package/dist/src/components/Text/text.doc.d.ts

@@ -1,4 +0,0 @@
-export declare function VariantsStory(): import("react").JSX.Element;
-export declare function ColorsStory(): import("react").JSX.Element;
-export declare function WeightsStory(): import("react").JSX.Element;
-export declare function AlignmentsStory(): import("react").JSX.Element;

package/dist/src/components/Textarea/textarea.doc.d.ts

@@ -1,2 +0,0 @@
-export declare function SizesStory(): import("react").JSX.Element;
-export declare function DisabledStory(): import("react").JSX.Element;

package/dist/src/components/Toggle/toggle.doc.d.ts

@@ -1 +0,0 @@
-export declare function VariantsStory(): import("react").JSX.Element;

package/dist/src/components/ToggleGroup/toggle-group.doc.d.ts

@@ -1,3 +0,0 @@
-export declare function DefaultStory(): import("react").JSX.Element;
-export declare function OutlineStory(): import("react").JSX.Element;
-export declare function VerticalStory(): import("react").JSX.Element;

package/dist/src/demos/accordion.demo.d.ts

@@ -1,5 +0,0 @@
-export declare function AccordionDemo(): import("react").JSX.Element;
-export declare const demos: {
-    name: string;
-    component: typeof AccordionDemo;
-}[];

package/package.build.json

@@ -1,39 +0,0 @@
-{
-  "name": "@blenx-dev/ui",
-  "version": "0.0.0",
-  "type": "module",
-  "sideEffects": ["**/*.css"],
-  "files": ["dist"],
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
-    },
-    "./components": {
-      "types": "./dist/components/index.d.ts",
-      "import": "./dist/components/index.js"
-    },
-    "./components/*": {
-      "types": "./dist/components/*.d.ts",
-      "import": "./dist/components/*.js"
-    },
-    "./globals.css": "./dist/styles/globals.css"
-  },
-  "publishConfig": {
-    "access": "public"
-  },
-  "dependencies": {
-    "@blenx-dev/theme": "^1.0.0",
-    "@base-ui/react": "^1.0.0",
-    "@vanilla-extract/css": "^1.20.1",
-    "@vanilla-extract/recipes": "^0.5.7",
-    "@vanilla-extract/sprinkles": "^1.6.5",
-    "clsx": "^2.1.1",
-    "react": "^19",
-    "react-dom": "^19"
-  },
-  "peerDependencies": {
-    "react": "^19",
-    "react-dom": "^19"
-  }
-}

package/scripts/generate-api.ts

@@ -1,183 +0,0 @@
-import { existsSync, mkdirSync, readdirSync, writeFileSync } from "node:fs";
-import { join, dirname, basename } from "node:path";
-import { fileURLToPath } from "node:url";
-import { withCustomConfig, type ComponentDoc, type PropItem } from "react-docgen-typescript";
-
-const __dirname = dirname(fileURLToPath(import.meta.url));
-
-// =====================
-// Paths
-// =====================
-const REPO_ROOT = dirname(__dirname);
-const UI_SRC = join(REPO_ROOT, "src");
-const COMPONENTS_DIR = join(UI_SRC, "components");
-const DATATABLE_DIR = join(UI_SRC, "DataTable");
-const OUTPUT_DIR = join(REPO_ROOT, "generated", "api");
-const TSCONFIG_PATH = join(REPO_ROOT, "tsconfig.json");
-
-// =====================
-// Types (output shape kept compatible with the old script)
-// =====================
-interface ApiProp {
-  name: string;
-  type: string;
-  optional: boolean;
-  description: string;
-  default?: string;
-  deprecated?: string;
-  since?: string;
-}
-
-interface ApiMeta {
-  name: string;
-  description: string;
-  props: ApiProp[];
-}
-
-// =====================
-// react-docgen-typescript setup
-// =====================
-// Uses the real TS compiler — correctly resolves extended interfaces,
-// generics (e.g. React.ComponentProps<'button'>), unions, and intersections.
-const parser = withCustomConfig(TSCONFIG_PATH, {
-  savePropValueAsString: true,
-  shouldExtractLiteralValuesFromEnum: true,
-  shouldRemoveUndefinedFromOptional: true,
-  // Only pull props actually declared/extended within the package —
-  // skip ones inherited purely from DOM/React internals with no JSDoc.
-  propFilter: (prop: PropItem) => {
-    if (prop.parent?.fileName.includes("node_modules/@types/react")) {
-      return !!prop.description;
-    }
-    return true;
-  },
-});
-
-// =====================
-// Discovery (unchanged from original)
-// =====================
-function findComponentDirs(dir: string): string[] {
-  if (!existsSync(dir)) return [];
-  const out: string[] = [];
-  for (const entry of readdirSync(dir, { withFileTypes: true })) {
-    if (!entry.isDirectory()) continue;
-    if (entry.name === "node_modules" || entry.name.startsWith(".")) continue;
-    const dp = join(dir, entry.name);
-    const hasSrc = readdirSync(dp).some((f) => f.endsWith(".tsx") || f.endsWith(".ts"));
-    out.push(...(hasSrc ? [dp] : findComponentDirs(dp)));
-  }
-  return out;
-}
-
-function findMainFile(dir: string): string | null {
-  const files = readdirSync(dir);
-  const base = basename(dir);
-  const hit = files.find((f) => f === `${base}.tsx` || f === `${base}.ts`);
-  if (hit) return join(dir, hit);
-  const tsx = files.find((f) => f.endsWith(".tsx"));
-  if (tsx) return join(dir, tsx);
-  const ts = files.find((f) => f.endsWith(".ts"));
-  if (ts) return join(dir, ts);
-  return null;
-}
-
-// =====================
-// Extraction
-// =====================
-function toApiMeta(doc: ComponentDoc): ApiMeta {
-  const props: ApiProp[] = Object.values(doc.props).map((p) => {
-    const tags = p.tags ?? {};
-    const out: ApiProp = {
-      name: p.name,
-      type: p.type.name,
-      optional: !p.required,
-      description: p.description ?? "",
-    };
-    if (p.defaultValue?.value !== undefined) {
-      out.default = String(p.defaultValue.value);
-    }
-    if (typeof tags.deprecated === "string") out.deprecated = tags.deprecated;
-    if (typeof tags.since === "string") out.since = tags.since;
-    return out;
-  });
-
-  // Stable ordering — required props first, then alphabetical
-  props.sort((a, b) => {
-    if (a.optional !== b.optional) return a.optional ? 1 : -1;
-    return a.name.localeCompare(b.name);
-  });
-
-  return { name: doc.displayName, description: doc.description ?? "", props };
-}
-
-function extractApi(filePath: string): ApiMeta | null {
-  const docs = parser.parse(filePath);
-  if (!docs.length) return null;
-
-  // A file may export multiple components (rare) — prefer the one matching
-  // the folder name, otherwise take the first documented export.
-  const folderName = basename(dirname(filePath));
-  const pascal = folderName
-    .split("-")
-    .map((s) => s[0]?.toUpperCase() + s.slice(1))
-    .join("");
-
-  const match = docs.find((d) => d.displayName === pascal) ?? docs[0];
-  return toApiMeta(match);
-}
-
-// =====================
-// Main
-// =====================
-function generate() {
-  console.log("\n── Generating API Metadata ──\n");
-  if (!existsSync(OUTPUT_DIR)) mkdirSync(OUTPUT_DIR, { recursive: true });
-
-  const dirs = [...findComponentDirs(COMPONENTS_DIR), ...findComponentDirs(DATATABLE_DIR)];
-
-  let generated = 0;
-  let skipped = 0;
-
-  for (const dir of dirs) {
-    const file = findMainFile(dir);
-    if (!file) {
-      skipped++;
-      continue;
-    }
-
-    let api: ApiMeta | null = null;
-    try {
-      api = extractApi(file);
-    } catch (err) {
-      console.warn(`  ✗ ${basename(dir)} — parse error: ${(err as Error).message}`);
-      skipped++;
-      continue;
-    }
-
-    if (!api || api.props.length === 0) {
-      skipped++;
-      continue;
-    }
-
-    const out = join(OUTPUT_DIR, `${basename(dir)}.json`);
-    writeFileSync(out, JSON.stringify(api, null, 2));
-    console.log(`  ✔ ${basename(dir)}.json  (${api.props.length} props)`);
-    generated++;
-  }
-
-  console.log(`\n  Generated: ${generated}`);
-  console.log(`  Skipped:   ${skipped}`);
-  console.log(`\n✓ Complete\n`);
-
-  if (skipped > 0) {
-    console.log(
-      "  Tip: skipped components either have no <Name>Props type docgen could find,\n" +
-        "  or react-docgen-typescript failed to parse them. Run with the file path\n" +
-        "  directly through `parser.parse()` to debug a specific component.\n",
-    );
-  }
-}
-
-if (import.meta.main) {
-  generate();
-}

package/scripts/generate-package.ts

@@ -1,106 +0,0 @@
-import { readdir, readFile } from "node:fs/promises";
-import path from "node:path";
-
-const packageRoot = process.cwd();
-const repoRoot = path.resolve(packageRoot, "../..");
-
-/**
- * Read the root package.json (for catalog dependencies)
- */
-const rootPackage = JSON.parse(
-  await readFile(path.join(repoRoot, "package.json"), "utf8"),
-);
-
-/**
- * Discover every workspace package and its version.
- */
-const workspacePackages = new Map<
-  string,
-  {
-    version: string;
-    directory: string;
-  }
->();
-
-const packagesDir = path.join(repoRoot, "packages");
-
-for (const dir of await readdir(packagesDir, { withFileTypes: true })) {
-  if (!dir.isDirectory()) continue;
-
-  const packageJsonPath = path.join(
-    packagesDir,
-    dir.name,
-    "package.json",
-  );
-
-  try {
-    const pkg = JSON.parse(await readFile(packageJsonPath, "utf8"));
-
-    workspacePackages.set(pkg.name, {
-      version: pkg.version,
-      directory: path.join(packagesDir, dir.name),
-    });
-  } catch {
-    // ignore folders without package.json
-  }
-}
-
-async function resolveVersion(
-  packageName: string,
-  version: string,
-): Promise<string> {
-  //
-  // Normal dependency
-  //
-  if (!version.startsWith("workspace:") && version !== "catalog:") {
-    return version;
-  }
-
-  //
-  // Workspace dependency
-  //
-  if (version.startsWith("workspace:")) {
-    const workspace = workspacePackages.get(packageName);
-
-    if (!workspace) {
-      throw new Error(
-        `Unable to resolve workspace package "${packageName}"`,
-      );
-    }
-
-    return `^${workspace.version}`;
-  }
-
-  //
-  // Bun catalog dependency
-  //
-  if (version === "catalog:") {
-    const catalog = rootPackage.catalog ?? {};
-
-    const resolved = catalog[packageName];
-
-    if (!resolved) {
-      throw new Error(
-        `Unable to resolve catalog dependency "${packageName}"`,
-      );
-    }
-
-    return resolved;
-  }
-
-  return version;
-}
-
-export async function resolveDependencies(
-  deps?: Record<string, string>,
-) {
-  if (!deps) return {};
-
-  const resolved: Record<string, string> = {};
-
-  for (const [name, version] of Object.entries(deps)) {
-    resolved[name] = await resolveVersion(name, version);
-  }
-
-  return resolved;
-}

package/src/DataTable/data-table-column-toggle.tsx

@@ -1,73 +0,0 @@
-import { themeContract } from "@blenx-dev/theme/contract";
-import { ListIcon } from "@phosphor-icons/react";
-import type { Table } from "@tanstack/react-table";
-import * as styles from "./data-table.css";
-import { Button, Menu, MenuItem, MenuPopup, MenuSeparator, MenuTrigger } from "../components";
-
-interface DataTableColumnToggleProps<TData> {
-  table: Table<TData>;
-}
-
-export function DataTableColumnToggle<TData>({ table }: DataTableColumnToggleProps<TData>) {
-  const columns = table.getAllLeafColumns().filter((column) => column.getCanHide());
-
-  if (columns.length === 0) return null;
-
-  const allVisible = columns.every((column) => column.getIsVisible());
-  const someVisible = columns.some((column) => column.getIsVisible());
-
-  return (
-    <Menu>
-      <MenuTrigger render={<Button variant="outline" size="small" />}>
-        <ListIcon size={16} />
-        <span>Columns</span>
-      </MenuTrigger>
-      <MenuPopup align="end">
-        <MenuItem
-          onClick={() => {
-            for (const column of columns) {
-              column.toggleVisibility(allVisible);
-            }
-          }}
-        >
-          <span className={styles.deselectLabel}>{allVisible ? "Deselect all" : "Select all"}</span>
-          <span className={allVisible ? styles.checkboxChecked : styles.checkboxUnchecked}>
-            {allVisible && <CheckMark />}
-            {!allVisible && someVisible && <div className={styles.partial} />}
-          </span>
-        </MenuItem>
-        <MenuSeparator />
-        {columns.map((column) => {
-          const label = column.columnDef.header?.toString() ?? column.id;
-          const isVisible = column.getIsVisible();
-          return (
-            <MenuItem key={column.id} onClick={() => column.toggleVisibility(!isVisible)}>
-              <span className={styles.itemLabel}>{label}</span>
-              <span className={isVisible ? styles.checkboxChecked : styles.checkboxUnchecked}>
-                {isVisible && <CheckMark />}
-              </span>
-            </MenuItem>
-          );
-        })}
-      </MenuPopup>
-    </Menu>
-  );
-}
-
-function CheckMark() {
-  return (
-    <svg
-      width="12"
-      height="12"
-      viewBox="0 0 24 24"
-      fill="none"
-      stroke={themeContract.contentOnPrimary}
-      strokeWidth="3"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    >
-      <title>Visible</title>
-      <polyline points="20 6 9 17 4 12" />
-    </svg>
-  );
-}