@xenide-io/the-old-ui-theme 0.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +252 -0
- package/dist/src/index.d.mts +893 -0
- package/dist/src/index.d.ts +893 -0
- package/dist/src/index.js +3913 -0
- package/dist/src/index.mjs +3728 -0
- package/dist/tailwind-preset.d.mts +10 -0
- package/dist/tailwind-preset.d.ts +10 -0
- package/dist/tailwind-preset.js +87 -0
- package/dist/tailwind-preset.mjs +66 -0
- package/package.json +104 -0
- package/src/app/globals.css +1214 -0
- package/src/styles/excel-themes.css +110 -0
- package/src/styles/lemon-primitives.css +550 -0
- package/src/styles/themes.css +1334 -0
- package/src/styles/typography.css +19 -0
- package/tailwind-preset.ts +70 -0
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Config } from 'tailwindcss';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* PostHog-theme **Tailwind preset** — `ph.*` colours, Lemon radii/shadows, font stack.
|
|
5
|
+
* Use in a consuming Next.js app: import this preset and set `presets: [posthogTheme]` in
|
|
6
|
+
* `tailwind.config.ts`, plus a `content` glob that matches your `ts` and `tsx` files under `src` (or `app`).
|
|
7
|
+
*/
|
|
8
|
+
declare const posthogThemePreset: Partial<Config>;
|
|
9
|
+
|
|
10
|
+
export { posthogThemePreset as default };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Config } from 'tailwindcss';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* PostHog-theme **Tailwind preset** — `ph.*` colours, Lemon radii/shadows, font stack.
|
|
5
|
+
* Use in a consuming Next.js app: import this preset and set `presets: [posthogTheme]` in
|
|
6
|
+
* `tailwind.config.ts`, plus a `content` glob that matches your `ts` and `tsx` files under `src` (or `app`).
|
|
7
|
+
*/
|
|
8
|
+
declare const posthogThemePreset: Partial<Config>;
|
|
9
|
+
|
|
10
|
+
export { posthogThemePreset as default };
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// tailwind-preset.ts
|
|
21
|
+
var tailwind_preset_exports = {};
|
|
22
|
+
__export(tailwind_preset_exports, {
|
|
23
|
+
default: () => tailwind_preset_default
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(tailwind_preset_exports);
|
|
26
|
+
var posthogThemePreset = {
|
|
27
|
+
theme: {
|
|
28
|
+
extend: {
|
|
29
|
+
fontFamily: {
|
|
30
|
+
sans: [
|
|
31
|
+
'"Open Runde"',
|
|
32
|
+
"ui-sans-serif",
|
|
33
|
+
"system-ui",
|
|
34
|
+
"-apple-system",
|
|
35
|
+
"BlinkMacSystemFont",
|
|
36
|
+
"Segoe UI",
|
|
37
|
+
"Roboto",
|
|
38
|
+
"Helvetica Neue",
|
|
39
|
+
"Arial",
|
|
40
|
+
"sans-serif"
|
|
41
|
+
],
|
|
42
|
+
mono: ["var(--ph-font-monospace-stack)"],
|
|
43
|
+
shortcut: ["var(--ph-font-shortcut-stack)"]
|
|
44
|
+
},
|
|
45
|
+
borderRadius: {
|
|
46
|
+
lemon: "var(--ph-radius-app)"
|
|
47
|
+
},
|
|
48
|
+
boxShadow: {
|
|
49
|
+
"lemon-ridge-primary": "0 0.1875rem 0 -1px var(--ph-primary-frame-bg)",
|
|
50
|
+
"lemon-ridge-secondary": "0 0.1875rem 0 -1px var(--ph-secondary-frame-bg)",
|
|
51
|
+
"elevation-3000": "0 3px 0 var(--ph-border-3000)",
|
|
52
|
+
ph: "0 1px 2px rgb(0 0 0 / 0.04), 0 1px 3px rgb(0 0 0 / 0.06)",
|
|
53
|
+
"ph-md": "0 2px 4px rgb(0 0 0 / 0.04), 0 4px 12px rgb(0 0 0 / 0.08)"
|
|
54
|
+
},
|
|
55
|
+
colors: {
|
|
56
|
+
ph: {
|
|
57
|
+
canvas: "var(--ph-canvas)",
|
|
58
|
+
surface: "var(--ph-surface)",
|
|
59
|
+
muted: "var(--ph-muted)",
|
|
60
|
+
toolbar: "var(--ph-toolbar)",
|
|
61
|
+
border: "var(--ph-border)",
|
|
62
|
+
strong: "var(--ph-border-strong)",
|
|
63
|
+
ink: "var(--ph-text-primary)",
|
|
64
|
+
subtle: "var(--ph-text-secondary)",
|
|
65
|
+
mutedtext: "var(--ph-text-tertiary)",
|
|
66
|
+
brand: "var(--ph-accent)",
|
|
67
|
+
"brand-hover": "var(--ph-accent-hover)",
|
|
68
|
+
blue: "var(--ph-blue)",
|
|
69
|
+
violet: "var(--ph-violet)",
|
|
70
|
+
purple: "var(--ph-purple)",
|
|
71
|
+
success: "var(--ph-success)",
|
|
72
|
+
warning: "var(--ph-warning)",
|
|
73
|
+
danger: "var(--ph-danger)",
|
|
74
|
+
info: "var(--ph-info)",
|
|
75
|
+
"btn-primary-face": "var(--ph-primary-button-face)",
|
|
76
|
+
"btn-primary-border": "var(--ph-primary-button-border)",
|
|
77
|
+
"btn-primary-frame": "var(--ph-primary-frame-bg)",
|
|
78
|
+
"btn-secondary-face": "var(--ph-secondary-button-bg)",
|
|
79
|
+
"btn-secondary-border": "var(--ph-secondary-button-border)",
|
|
80
|
+
"btn-secondary-frame": "var(--ph-secondary-frame-bg)"
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
},
|
|
85
|
+
plugins: []
|
|
86
|
+
};
|
|
87
|
+
var tailwind_preset_default = posthogThemePreset;
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
// tailwind-preset.ts
|
|
2
|
+
var posthogThemePreset = {
|
|
3
|
+
theme: {
|
|
4
|
+
extend: {
|
|
5
|
+
fontFamily: {
|
|
6
|
+
sans: [
|
|
7
|
+
'"Open Runde"',
|
|
8
|
+
"ui-sans-serif",
|
|
9
|
+
"system-ui",
|
|
10
|
+
"-apple-system",
|
|
11
|
+
"BlinkMacSystemFont",
|
|
12
|
+
"Segoe UI",
|
|
13
|
+
"Roboto",
|
|
14
|
+
"Helvetica Neue",
|
|
15
|
+
"Arial",
|
|
16
|
+
"sans-serif"
|
|
17
|
+
],
|
|
18
|
+
mono: ["var(--ph-font-monospace-stack)"],
|
|
19
|
+
shortcut: ["var(--ph-font-shortcut-stack)"]
|
|
20
|
+
},
|
|
21
|
+
borderRadius: {
|
|
22
|
+
lemon: "var(--ph-radius-app)"
|
|
23
|
+
},
|
|
24
|
+
boxShadow: {
|
|
25
|
+
"lemon-ridge-primary": "0 0.1875rem 0 -1px var(--ph-primary-frame-bg)",
|
|
26
|
+
"lemon-ridge-secondary": "0 0.1875rem 0 -1px var(--ph-secondary-frame-bg)",
|
|
27
|
+
"elevation-3000": "0 3px 0 var(--ph-border-3000)",
|
|
28
|
+
ph: "0 1px 2px rgb(0 0 0 / 0.04), 0 1px 3px rgb(0 0 0 / 0.06)",
|
|
29
|
+
"ph-md": "0 2px 4px rgb(0 0 0 / 0.04), 0 4px 12px rgb(0 0 0 / 0.08)"
|
|
30
|
+
},
|
|
31
|
+
colors: {
|
|
32
|
+
ph: {
|
|
33
|
+
canvas: "var(--ph-canvas)",
|
|
34
|
+
surface: "var(--ph-surface)",
|
|
35
|
+
muted: "var(--ph-muted)",
|
|
36
|
+
toolbar: "var(--ph-toolbar)",
|
|
37
|
+
border: "var(--ph-border)",
|
|
38
|
+
strong: "var(--ph-border-strong)",
|
|
39
|
+
ink: "var(--ph-text-primary)",
|
|
40
|
+
subtle: "var(--ph-text-secondary)",
|
|
41
|
+
mutedtext: "var(--ph-text-tertiary)",
|
|
42
|
+
brand: "var(--ph-accent)",
|
|
43
|
+
"brand-hover": "var(--ph-accent-hover)",
|
|
44
|
+
blue: "var(--ph-blue)",
|
|
45
|
+
violet: "var(--ph-violet)",
|
|
46
|
+
purple: "var(--ph-purple)",
|
|
47
|
+
success: "var(--ph-success)",
|
|
48
|
+
warning: "var(--ph-warning)",
|
|
49
|
+
danger: "var(--ph-danger)",
|
|
50
|
+
info: "var(--ph-info)",
|
|
51
|
+
"btn-primary-face": "var(--ph-primary-button-face)",
|
|
52
|
+
"btn-primary-border": "var(--ph-primary-button-border)",
|
|
53
|
+
"btn-primary-frame": "var(--ph-primary-frame-bg)",
|
|
54
|
+
"btn-secondary-face": "var(--ph-secondary-button-bg)",
|
|
55
|
+
"btn-secondary-border": "var(--ph-secondary-button-border)",
|
|
56
|
+
"btn-secondary-frame": "var(--ph-secondary-frame-bg)"
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
},
|
|
61
|
+
plugins: []
|
|
62
|
+
};
|
|
63
|
+
var tailwind_preset_default = posthogThemePreset;
|
|
64
|
+
export {
|
|
65
|
+
tailwind_preset_default as default
|
|
66
|
+
};
|
package/package.json
ADDED
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@xenide-io/the-old-ui-theme",
|
|
3
|
+
"version": "0.2.3",
|
|
4
|
+
"description": "Props-driven React components and theme tokens inspired by classic interface design — optimized for Next.js apps and internal tools.",
|
|
5
|
+
"author": "Xenide",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"homepage": "https://github.com/xenide-io/the-old-ui-theme",
|
|
8
|
+
"repository": {
|
|
9
|
+
"type": "git",
|
|
10
|
+
"url": "git+https://github.com/xenide-io/the-old-ui-theme.git"
|
|
11
|
+
},
|
|
12
|
+
"keywords": [
|
|
13
|
+
"react",
|
|
14
|
+
"components",
|
|
15
|
+
"ui",
|
|
16
|
+
"tailwindcss",
|
|
17
|
+
"design-system",
|
|
18
|
+
"theming"
|
|
19
|
+
],
|
|
20
|
+
"packageManager": "bun@1.3.5",
|
|
21
|
+
"engines": {
|
|
22
|
+
"node": ">=18.0.0"
|
|
23
|
+
},
|
|
24
|
+
"sideEffects": [
|
|
25
|
+
"*.css"
|
|
26
|
+
],
|
|
27
|
+
"main": "./dist/index.js",
|
|
28
|
+
"module": "./dist/index.mjs",
|
|
29
|
+
"types": "./dist/index.d.ts",
|
|
30
|
+
"exports": {
|
|
31
|
+
".": {
|
|
32
|
+
"types": "./dist/index.d.ts",
|
|
33
|
+
"import": "./dist/index.mjs",
|
|
34
|
+
"require": "./dist/index.js",
|
|
35
|
+
"default": "./dist/index.mjs"
|
|
36
|
+
},
|
|
37
|
+
"./styles.css": "./src/app/globals.css",
|
|
38
|
+
"./themes.css": "./src/styles/themes.css",
|
|
39
|
+
"./tailwind-preset": {
|
|
40
|
+
"types": "./dist/tailwind-preset.d.ts",
|
|
41
|
+
"import": "./dist/tailwind-preset.mjs",
|
|
42
|
+
"require": "./dist/tailwind-preset.js",
|
|
43
|
+
"default": "./dist/tailwind-preset.mjs"
|
|
44
|
+
}
|
|
45
|
+
},
|
|
46
|
+
"files": [
|
|
47
|
+
"dist",
|
|
48
|
+
"src/app/globals.css",
|
|
49
|
+
"src/styles",
|
|
50
|
+
"tailwind-preset.ts"
|
|
51
|
+
],
|
|
52
|
+
"scripts": {
|
|
53
|
+
"dev": "next dev",
|
|
54
|
+
"build": "next build",
|
|
55
|
+
"build:lib": "tsup src/index.ts tailwind-preset.ts --format cjs,esm --dts --external react,react-dom,next --clean --tsconfig ./tsconfig.lib.json",
|
|
56
|
+
"start": "next start",
|
|
57
|
+
"lint": "next lint",
|
|
58
|
+
"test": "tsc --noEmit",
|
|
59
|
+
"clean": "rm -rf .next out *.tsbuildinfo dist",
|
|
60
|
+
"icons:check": "node scripts/sync-posthog-icons.mjs",
|
|
61
|
+
"prepublishOnly": "bun run build:lib",
|
|
62
|
+
"release": "bun run test && npm publish"
|
|
63
|
+
},
|
|
64
|
+
"peerDependencies": {
|
|
65
|
+
"react": "^18.0.0",
|
|
66
|
+
"react-dom": "^18.0.0",
|
|
67
|
+
"next": ">=14.0.0",
|
|
68
|
+
"tailwindcss": "^3.4.0",
|
|
69
|
+
"chart.js": "^4.5.1",
|
|
70
|
+
"react-chartjs-2": "^5.3.1",
|
|
71
|
+
"d3-scale": "^4.0.2"
|
|
72
|
+
},
|
|
73
|
+
"peerDependenciesMeta": {
|
|
74
|
+
"chart.js": {
|
|
75
|
+
"optional": true
|
|
76
|
+
},
|
|
77
|
+
"react-chartjs-2": {
|
|
78
|
+
"optional": true
|
|
79
|
+
},
|
|
80
|
+
"d3-scale": {
|
|
81
|
+
"optional": true
|
|
82
|
+
}
|
|
83
|
+
},
|
|
84
|
+
"devDependencies": {
|
|
85
|
+
"@types/d3-scale": "^4.0.9",
|
|
86
|
+
"@types/node": "^20.14.10",
|
|
87
|
+
"@types/react": "^18.3.3",
|
|
88
|
+
"@types/react-dom": "^18.3.0",
|
|
89
|
+
"autoprefixer": "^10.4.19",
|
|
90
|
+
"chart.js": "^4.5.1",
|
|
91
|
+
"d3-scale": "^4.0.2",
|
|
92
|
+
"next": "^14.0.0",
|
|
93
|
+
"postcss": "^8.4.39",
|
|
94
|
+
"react": "^18.0.0",
|
|
95
|
+
"react-chartjs-2": "^5.3.1",
|
|
96
|
+
"react-dom": "^18.0.0",
|
|
97
|
+
"tailwindcss": "^3.4.4",
|
|
98
|
+
"tsup": "^8.5.1",
|
|
99
|
+
"typescript": "^5.5.3"
|
|
100
|
+
},
|
|
101
|
+
"publishConfig": {
|
|
102
|
+
"access": "public"
|
|
103
|
+
}
|
|
104
|
+
}
|