@mesob/ui 0.1.1 → 0.2.1

package/dist/lib/theme-schema.js

@@ -0,0 +1,95 @@
+// src/lib/theme-schema.ts
+var SHADE_KEYS = [
+  50,
+  100,
+  200,
+  300,
+  400,
+  500,
+  600,
+  700,
+  800,
+  900,
+  950
+];
+var THEME_VAR_NAMES = [
+  "--background",
+  "--foreground",
+  "--card",
+  "--card-foreground",
+  "--popover",
+  "--popover-foreground",
+  "--primary",
+  "--primary-foreground",
+  ...SHADE_KEYS.map((s) => `--primary-${s}`),
+  "--secondary",
+  "--secondary-foreground",
+  ...SHADE_KEYS.map((s) => `--secondary-${s}`),
+  "--accent",
+  "--accent-foreground",
+  ...SHADE_KEYS.map((s) => `--accent-${s}`),
+  "--muted",
+  "--muted-foreground",
+  "--destructive",
+  "--destructive-foreground",
+  "--border",
+  "--input",
+  "--ring",
+  "--chart-1",
+  "--chart-2",
+  "--chart-3",
+  "--chart-4",
+  "--chart-5",
+  "--radius",
+  "--spacing",
+  "--sidebar",
+  "--sidebar-foreground",
+  "--sidebar-primary",
+  "--sidebar-primary-foreground",
+  "--sidebar-accent",
+  "--sidebar-accent-foreground",
+  "--sidebar-active",
+  "--sidebar-border",
+  "--sidebar-ring",
+  "--overlay"
+];
+var THEME_VAR_SET = new Set(THEME_VAR_NAMES);
+var REQUIRED_THEME_VARS = [
+  "--primary",
+  "--primary-foreground",
+  ...SHADE_KEYS.map((s) => `--primary-${s}`),
+  "--secondary",
+  "--secondary-foreground",
+  ...SHADE_KEYS.map((s) => `--secondary-${s}`),
+  "--accent",
+  "--accent-foreground",
+  ...SHADE_KEYS.map((s) => `--accent-${s}`),
+  "--radius",
+  "--spacing"
+];
+function validateTheme(theme) {
+  const keys = new Set(Object.keys(theme));
+  const unknown = [];
+  const missing = [];
+  for (const key of keys) {
+    if (!THEME_VAR_SET.has(key)) {
+      unknown.push(key);
+    }
+  }
+  for (const key of REQUIRED_THEME_VARS) {
+    if (!keys.has(key)) {
+      missing.push(key);
+    }
+  }
+  return {
+    valid: unknown.length === 0 && missing.length === 0,
+    unknown,
+    missing
+  };
+}
+export {
+  REQUIRED_THEME_VARS,
+  THEME_VAR_NAMES,
+  validateTheme
+};
+//# sourceMappingURL=theme-schema.js.map

package/dist/lib/theme-schema.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lib/theme-schema.ts"],"sourcesContent":["/**\n * Canonical theme variable names for consumer theme (theme.css or generateTheme).\n * UI components depend on these CSS vars; consumer defines them.\n */\n\nconst SHADE_KEYS = [\n  50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950,\n] as const;\n\nexport const THEME_VAR_NAMES = [\n  '--background',\n  '--foreground',\n  '--card',\n  '--card-foreground',\n  '--popover',\n  '--popover-foreground',\n  '--primary',\n  '--primary-foreground',\n  ...SHADE_KEYS.map((s) => `--primary-${s}`),\n  '--secondary',\n  '--secondary-foreground',\n  ...SHADE_KEYS.map((s) => `--secondary-${s}`),\n  '--accent',\n  '--accent-foreground',\n  ...SHADE_KEYS.map((s) => `--accent-${s}`),\n  '--muted',\n  '--muted-foreground',\n  '--destructive',\n  '--destructive-foreground',\n  '--border',\n  '--input',\n  '--ring',\n  '--chart-1',\n  '--chart-2',\n  '--chart-3',\n  '--chart-4',\n  '--chart-5',\n  '--radius',\n  '--spacing',\n  '--sidebar',\n  '--sidebar-foreground',\n  '--sidebar-primary',\n  '--sidebar-primary-foreground',\n  '--sidebar-accent',\n  '--sidebar-accent-foreground',\n  '--sidebar-active',\n  '--sidebar-border',\n  '--sidebar-ring',\n  '--overlay',\n] as const;\n\nexport type ThemeVarName = (typeof THEME_VAR_NAMES)[number];\n\nconst THEME_VAR_SET = new Set<string>(THEME_VAR_NAMES);\n\n/** Vars that a minimal theme (e.g. generateTheme) should provide for primary/secondary/accent. */\nexport const REQUIRED_THEME_VARS: readonly string[] = [\n  '--primary',\n  '--primary-foreground',\n  ...SHADE_KEYS.map((s) => `--primary-${s}`),\n  '--secondary',\n  '--secondary-foreground',\n  ...SHADE_KEYS.map((s) => `--secondary-${s}`),\n  '--accent',\n  '--accent-foreground',\n  ...SHADE_KEYS.map((s) => `--accent-${s}`),\n  '--radius',\n  '--spacing',\n];\n\nexport type ThemeValidation = {\n  valid: boolean;\n  unknown: string[];\n  missing: string[];\n};\n\n/**\n * Validates a theme object against the consumer theme contract.\n * - unknown: keys not in THEME_VAR_NAMES (typos / unsupported).\n * - missing: required vars absent (for full theme override).\n */\nexport function validateTheme(theme: Record<string, string>): ThemeValidation {\n  const keys = new Set(Object.keys(theme));\n  const unknown: string[] = [];\n  const missing: string[] = [];\n\n  for (const key of keys) {\n    if (!THEME_VAR_SET.has(key)) {\n      unknown.push(key);\n    }\n  }\n  for (const key of REQUIRED_THEME_VARS) {\n    if (!keys.has(key)) {\n      missing.push(key);\n    }\n  }\n\n  return {\n    valid: unknown.length === 0 && missing.length === 0,\n    unknown,\n    missing,\n  };\n}\n"],"mappings":";AAKA,IAAM,aAAa;AAAA,EACjB;AAAA,EAAI;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AACnD;AAEO,IAAM,kBAAkB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG,WAAW,IAAI,CAAC,MAAM,aAAa,CAAC,EAAE;AAAA,EACzC;AAAA,EACA;AAAA,EACA,GAAG,WAAW,IAAI,CAAC,MAAM,eAAe,CAAC,EAAE;AAAA,EAC3C;AAAA,EACA;AAAA,EACA,GAAG,WAAW,IAAI,CAAC,MAAM,YAAY,CAAC,EAAE;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAIA,IAAM,gBAAgB,IAAI,IAAY,eAAe;AAG9C,IAAM,sBAAyC;AAAA,EACpD;AAAA,EACA;AAAA,EACA,GAAG,WAAW,IAAI,CAAC,MAAM,aAAa,CAAC,EAAE;AAAA,EACzC;AAAA,EACA;AAAA,EACA,GAAG,WAAW,IAAI,CAAC,MAAM,eAAe,CAAC,EAAE;AAAA,EAC3C;AAAA,EACA;AAAA,EACA,GAAG,WAAW,IAAI,CAAC,MAAM,YAAY,CAAC,EAAE;AAAA,EACxC;AAAA,EACA;AACF;AAaO,SAAS,cAAc,OAAgD;AAC5E,QAAM,OAAO,IAAI,IAAI,OAAO,KAAK,KAAK,CAAC;AACvC,QAAM,UAAoB,CAAC;AAC3B,QAAM,UAAoB,CAAC;AAE3B,aAAW,OAAO,MAAM;AACtB,QAAI,CAAC,cAAc,IAAI,GAAG,GAAG;AAC3B,cAAQ,KAAK,GAAG;AAAA,IAClB;AAAA,EACF;AACA,aAAW,OAAO,qBAAqB;AACrC,QAAI,CAAC,KAAK,IAAI,GAAG,GAAG;AAClB,cAAQ,KAAK,GAAG;AAAA,IAClB;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO,QAAQ,WAAW,KAAK,QAAQ,WAAW;AAAA,IAClD;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mesob/ui",
-  "version": "0.1.1",
+  "version": "0.2.1",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -10,8 +10,6 @@
       "types": "./dist/index.d.ts",
       "default": "./dist/index.js"
     },
-    "./globals.css": "./src/styles/globals.css",
-    "./styles/globals.css": "./src/styles/globals.css",
     "./postcss.config": "./postcss.config.mjs",
     "./lib/*": {
       "types": "./dist/lib/*.d.ts",
@@ -33,14 +31,17 @@
       "types": "./dist/components/entity/index.d.ts",
       "default": "./dist/components/entity/index.js"
     },
+    "./components/page": {
+      "types": "./dist/components/page/index.d.ts",
+      "default": "./dist/components/page/index.js"
+    },
     "./components/section": {
       "types": "./dist/components/section/index.d.ts",
       "default": "./dist/components/section/index.js"
     }
   },
   "files": [
-    "dist",
-    "src/styles"
+    "dist"
   ],
   "dependencies": {
     "@hookform/resolvers": "^5.2.2",
@@ -95,12 +96,14 @@
     "@tailwindcss/postcss": "^4.1.11",
     "@types/react": "^19",
     "@types/react-dom": "^19",
+    "next-intl": "^4.5.6",
     "tailwindcss": "^4.1.11",
     "tsup": "^8.5.0",
     "tsx": "^4.20.3",
     "typescript": "^5.7.2"
   },
   "peerDependencies": {
+    "next-intl": "^4.5.6",
     "nuqs": "^2.8.1",
     "react": "^19.2.0",
     "react-dom": "^19.2.0",

package/src/styles/globals.css

@@ -1,126 +0,0 @@
-@import "tailwindcss";
-@import "tw-animate-css";
-@source "../../../../apps/**/*.{ts,tsx}";
-@source "../**/*.{ts,tsx}";
-@source "../../../auth-react/src/**/*.{ts,tsx}";
-
-@custom-variant dark (&:is(.dark *));
-
-:root {
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.145 0 0);
-  --card: oklch(1 0 0);
-  --card-foreground: oklch(0.145 0 0);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.145 0 0);
-  --primary: oklch(0.205 0 0);
-  --primary-foreground: oklch(0.985 0 0);
-  --secondary: oklch(0.97 0 0);
-  --secondary-foreground: oklch(0.205 0 0);
-  --muted: oklch(0.97 0 0);
-  --muted-foreground: oklch(0.556 0 0);
-  --accent: oklch(0.97 0 0);
-  --accent-foreground: oklch(0.205 0 0);
-  --destructive: oklch(0.577 0.245 27.325);
-  --destructive-foreground: oklch(0.577 0.245 27.325);
-  --border: oklch(0.922 0 0);
-  --input: oklch(0.922 0 0);
-  --ring: oklch(0.708 0 0);
-  --chart-1: oklch(0.646 0.222 41.116);
-  --chart-2: oklch(0.6 0.118 184.704);
-  --chart-3: oklch(0.398 0.07 227.392);
-  --chart-4: oklch(0.828 0.189 84.429);
-  --chart-5: oklch(0.769 0.188 70.08);
-  --radius: 0.625rem;
-  --sidebar: oklch(0.985 0 0);
-  --sidebar-foreground: oklch(0.145 0 0);
-  --sidebar-primary: oklch(0.205 0 0);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.97 0 0);
-  --sidebar-accent-foreground: oklch(0.205 0 0);
-  --sidebar-border: oklch(0.922 0 0);
-  --sidebar-ring: oklch(0.708 0 0);
-}
-
-.dark {
-  --background: oklch(0.145 0 0);
-  --foreground: oklch(0.985 0 0);
-  --card: oklch(0.145 0 0);
-  --card-foreground: oklch(0.985 0 0);
-  --popover: oklch(0.145 0 0);
-  --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.985 0 0);
-  --primary-foreground: oklch(0.205 0 0);
-  --secondary: oklch(0.269 0 0);
-  --secondary-foreground: oklch(0.985 0 0);
-  --muted: oklch(0.269 0 0);
-  --muted-foreground: oklch(0.708 0 0);
-  --accent: oklch(0.269 0 0);
-  --accent-foreground: oklch(0.985 0 0);
-  --destructive: oklch(0.396 0.141 25.723);
-  --destructive-foreground: oklch(0.637 0.237 25.331);
-  --border: oklch(0.269 0 0);
-  --input: oklch(0.269 0 0);
-  --ring: oklch(0.556 0 0);
-  --chart-1: oklch(0.488 0.243 264.376);
-  --chart-2: oklch(0.696 0.17 162.48);
-  --chart-3: oklch(0.769 0.188 70.08);
-  --chart-4: oklch(0.627 0.265 303.9);
-  --chart-5: oklch(0.645 0.246 16.439);
-  --sidebar: oklch(0.205 0 0);
-  --sidebar-foreground: oklch(0.985 0 0);
-  --sidebar-primary: oklch(0.488 0.243 264.376);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.269 0 0);
-  --sidebar-accent-foreground: oklch(0.985 0 0);
-  --sidebar-border: oklch(0.269 0 0);
-  --sidebar-ring: oklch(0.439 0 0);
-}
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --color-chart-1: var(--chart-1);
-  --color-chart-2: var(--chart-2);
-  --color-chart-3: var(--chart-3);
-  --color-chart-4: var(--chart-4);
-  --color-chart-5: var(--chart-5);
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-  --color-sidebar: var(--sidebar);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-ring: var(--sidebar-ring);
-}
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}