@akbarsafari00/ods-react 0.1.0

package/dist/styles/themes/ods-default.css

@@ -0,0 +1,130 @@
+/*
+ * ODS Default
+ *
+ * A restrained enterprise theme using the ODS semantic variable contract.
+ * Components consume semantic variables; brand themes only replace this map.
+ */
+
+:root {
+  --ods-radius-control: 4px;
+  --ods-radius-surface: 6px;
+  --ods-layer-base: 0;
+  --ods-layer-sticky: 100;
+  --ods-layer-floating: 200;
+  --ods-layer-scrim: 300;
+  --ods-layer-modal: 400;
+  --ods-layer-menu: 450;
+  --ods-layer-notification: 500;
+  --ods-layer-tooltip: 600;
+  --ods-motion-duration-feedback: 120ms;
+  --ods-motion-duration-enter: 160ms;
+  --ods-motion-duration-exit: 120ms;
+  --ods-motion-duration-panel-enter: 220ms;
+  --ods-motion-duration-panel-exit: 160ms;
+  --ods-motion-easing-standard: cubic-bezier(0.2, 0, 0.38, 0.9);
+  --ods-motion-easing-enter: cubic-bezier(0, 0, 0.38, 0.9);
+  --ods-motion-easing-exit: cubic-bezier(0.2, 0, 1, 0.9);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  :root {
+    --ods-motion-duration-feedback: 0ms;
+    --ods-motion-duration-enter: 0ms;
+    --ods-motion-duration-exit: 0ms;
+    --ods-motion-duration-panel-enter: 0ms;
+    --ods-motion-duration-panel-exit: 0ms;
+  }
+}
+
+:root,
+[data-theme="ods-default"][data-mode="light"] {
+  color-scheme: light;
+  --background: oklch(0.985 0.002 255);
+  --foreground: oklch(0.205 0.018 255);
+  --surface: oklch(1 0 0);
+  --surface-muted: oklch(0.965 0.006 255);
+  --surface-raised: oklch(1 0 0);
+  --card: var(--surface);
+  --card-foreground: var(--foreground);
+  --popover: var(--surface-raised);
+  --popover-foreground: var(--foreground);
+  --primary: oklch(0.51 0.17 255);
+  --primary-foreground: oklch(0.985 0.004 255);
+  --secondary: oklch(0.94 0.014 255);
+  --secondary-foreground: oklch(0.29 0.045 255);
+  --muted: var(--surface-muted);
+  --muted-foreground: oklch(0.49 0.025 255);
+  --accent: oklch(0.925 0.025 255);
+  --accent-foreground: oklch(0.28 0.075 255);
+  --destructive: oklch(0.56 0.205 27);
+  --destructive-foreground: oklch(0.985 0.004 27);
+  --success: oklch(0.49 0.14 148);
+  --success-foreground: oklch(0.985 0.004 148);
+  --warning: oklch(0.69 0.14 78);
+  --warning-foreground: oklch(0.25 0.05 78);
+  --info: oklch(0.57 0.15 235);
+  --info-foreground: oklch(0.985 0.004 235);
+  --border: oklch(0.885 0.012 255);
+  --input: oklch(0.855 0.016 255);
+  --ring: oklch(0.58 0.16 255);
+  --chart-1: oklch(0.58 0.16 255);
+  --chart-2: oklch(0.56 0.14 160);
+  --chart-3: oklch(0.66 0.14 75);
+  --chart-4: oklch(0.58 0.17 310);
+  --chart-5: oklch(0.59 0.18 25);
+  --radius: 0.375rem;
+  --sidebar: oklch(0.965 0.008 255);
+  --sidebar-foreground: var(--foreground);
+  --sidebar-primary: var(--primary);
+  --sidebar-primary-foreground: var(--primary-foreground);
+  --sidebar-accent: oklch(0.92 0.025 255);
+  --sidebar-accent-foreground: oklch(0.28 0.075 255);
+  --sidebar-border: var(--border);
+  --sidebar-ring: var(--ring);
+}
+
+.dark,
+[data-theme="ods-default"][data-mode="dark"] {
+  color-scheme: dark;
+  --background: oklch(0.17 0.018 255);
+  --foreground: oklch(0.94 0.008 255);
+  --surface: oklch(0.205 0.02 255);
+  --surface-muted: oklch(0.245 0.022 255);
+  --surface-raised: oklch(0.27 0.025 255);
+  --card: var(--surface);
+  --card-foreground: var(--foreground);
+  --popover: var(--surface-raised);
+  --popover-foreground: var(--foreground);
+  --primary: oklch(0.69 0.15 255);
+  --primary-foreground: oklch(0.17 0.03 255);
+  --secondary: oklch(0.29 0.035 255);
+  --secondary-foreground: oklch(0.93 0.012 255);
+  --muted: var(--surface-muted);
+  --muted-foreground: oklch(0.7 0.025 255);
+  --accent: oklch(0.32 0.055 255);
+  --accent-foreground: oklch(0.94 0.012 255);
+  --destructive: oklch(0.69 0.19 25);
+  --destructive-foreground: oklch(0.17 0.025 25);
+  --success: oklch(0.67 0.14 148);
+  --success-foreground: oklch(0.17 0.025 148);
+  --warning: oklch(0.78 0.13 78);
+  --warning-foreground: oklch(0.2 0.04 78);
+  --info: oklch(0.71 0.13 235);
+  --info-foreground: oklch(0.17 0.025 235);
+  --border: oklch(0.42 0.025 255 / 70%);
+  --input: oklch(0.46 0.028 255 / 75%);
+  --ring: oklch(0.69 0.15 255);
+  --chart-1: oklch(0.69 0.15 255);
+  --chart-2: oklch(0.7 0.13 160);
+  --chart-3: oklch(0.76 0.13 75);
+  --chart-4: oklch(0.69 0.15 310);
+  --chart-5: oklch(0.7 0.16 25);
+  --sidebar: oklch(0.195 0.022 255);
+  --sidebar-foreground: var(--foreground);
+  --sidebar-primary: var(--primary);
+  --sidebar-primary-foreground: var(--primary-foreground);
+  --sidebar-accent: oklch(0.3 0.045 255);
+  --sidebar-accent-foreground: oklch(0.94 0.012 255);
+  --sidebar-border: var(--border);
+  --sidebar-ring: var(--ring);
+}

package/package.json

@@ -0,0 +1,88 @@
+{
+  "name": "@akbarsafari00/ods-react",
+  "version": "0.1.0",
+  "description": "ODS-owned React components, semantic styles, and accessible interaction patterns.",
+  "type": "module",
+  "private": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "sideEffects": [
+    "./dist/styles/**/*.css"
+  ],
+  "keywords": [
+    "design-system",
+    "ods",
+    "react",
+    "rtl",
+    "tailwindcss",
+    "ui-components"
+  ],
+  "author": "akbarsafari00",
+  "scripts": {
+    "clean": "node ./scripts/clean-dist.mjs",
+    "build": "npm run clean && tsc -p tsconfig.build.json && node ./scripts/copy-styles.mjs",
+    "lint": "eslint",
+    "format": "prettier --write \"**/*.{ts,tsx}\"",
+    "typecheck": "tsc --noEmit",
+    "verify:package": "node ./scripts/verify-package.mjs",
+    "prepack": "npm run build && npm run verify:package"
+  },
+  "dependencies": {
+    "@fontsource-variable/geist": "^5.3.0",
+    "@tanstack/react-table": "9.2.4",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "lucide-react": "^1.37.0",
+    "radix-ui": "^1.6.7",
+    "tailwind-merge": "^3.6.0",
+    "tw-animate-css": "^1.4.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^10",
+    "@tailwindcss/vite": "^4",
+    "@turbo/gen": "^2.9.15",
+    "@types/node": "^24",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "eslint": "^10",
+    "eslint-plugin-react-hooks": "^7.1.1",
+    "eslint-plugin-react-refresh": "^0.5.2",
+    "globals": "^17",
+    "react": "^19.2.6",
+    "react-dom": "^19.2.6",
+    "tailwindcss": "^4",
+    "typescript": "~6",
+    "typescript-eslint": "^8"
+  },
+  "peerDependencies": {
+    "react": ">=19.2.0 <20",
+    "react-dom": ">=19.2.0 <20",
+    "tailwindcss": ">=4.3.0 <5"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./globals.css": "./dist/styles/globals.css",
+    "./themes/*": "./dist/styles/themes/*.css",
+    "./lib/*": {
+      "types": "./dist/lib/*.d.ts",
+      "import": "./dist/lib/*.js"
+    },
+    "./components/*": {
+      "types": "./dist/components/*.d.ts",
+      "import": "./dist/components/*.js"
+    },
+    "./package.json": "./package.json"
+  }
+}