@elsapiens/styles 0.1.0

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.
Files changed (8) hide show
  1. package/README.md +255 -0
  2. package/dist/backgrounds.css +892 -0
  3. package/dist/color-schemes.css +189 -0
  4. package/dist/components.css +1072 -0
  5. package/dist/index.css +888 -0
  6. package/dist/variables.css +796 -0
  7. package/package.json +33 -0
  8. package/tailwind-preset.js +130 -0
package/package.json ADDED
@@ -0,0 +1,33 @@
1
+ {
2
+ "name": "@elsapiens/styles",
3
+ "version": "0.1.0",
4
+ "description": "CSS styles and Tailwind preset for elSapiens SDK",
5
+ "license": "MIT",
6
+ "type": "module",
7
+ "main": "./dist/index.css",
8
+ "exports": {
9
+ ".": "./dist/index.css",
10
+ "./variables": "./dist/variables.css",
11
+ "./components": "./dist/components.css",
12
+ "./color-schemes": "./dist/color-schemes.css",
13
+ "./backgrounds": "./dist/backgrounds.css",
14
+ "./tailwind-preset": "./tailwind-preset.js",
15
+ "./package.json": "./package.json"
16
+ },
17
+ "files": [
18
+ "dist",
19
+ "tailwind-preset.js"
20
+ ],
21
+ "devDependencies": {
22
+ "tailwindcss": "^3.4.1",
23
+ "tailwindcss-animate": "^1.0.7"
24
+ },
25
+ "peerDependencies": {
26
+ "tailwindcss": "^3.4.0"
27
+ },
28
+ "scripts": {
29
+ "build": "mkdir -p dist && cp src/*.css dist/ && cp src/tailwind-preset.js .",
30
+ "dev": "npm run build",
31
+ "clean": "rm -rf dist tailwind-preset.js"
32
+ }
33
+ }
package/tailwind-preset.js ADDED
@@ -0,0 +1,130 @@
1
+ /** @type {import('tailwindcss').Config} */
2
+ module.exports = {
3
+ darkMode: ['class'],
4
+ theme: {
5
+ extend: {
6
+ colors: {
7
+ // Primary - Wisteria Blue
8
+ primary: {
9
+ 50: 'var(--primary-50)',
10
+ 100: 'var(--primary-100)',
11
+ 200: 'var(--primary-200)',
12
+ 300: 'var(--primary-300)',
13
+ 400: 'var(--primary-400)',
14
+ 500: 'var(--primary-500)',
15
+ DEFAULT: 'var(--primary)',
16
+ 600: 'var(--primary-600)',
17
+ 700: 'var(--primary-700)',
18
+ 800: 'var(--primary-800)',
19
+ 900: 'var(--primary-900)',
20
+ 950: 'var(--primary-950)',
21
+ foreground: 'var(--primary-foreground)',
22
+ },
23
+ // Semantic colors
24
+ background: 'var(--background)',
25
+ foreground: 'var(--foreground)',
26
+ card: {
27
+ DEFAULT: 'var(--card)',
28
+ foreground: 'var(--card-foreground)',
29
+ },
30
+ popover: {
31
+ DEFAULT: 'var(--popover)',
32
+ foreground: 'var(--popover-foreground)',
33
+ },
34
+ secondary: {
35
+ DEFAULT: 'var(--secondary)',
36
+ foreground: 'var(--secondary-foreground)',
37
+ },
38
+ muted: {
39
+ DEFAULT: 'var(--muted)',
40
+ foreground: 'var(--muted-foreground)',
41
+ },
42
+ accent: {
43
+ DEFAULT: 'var(--accent)',
44
+ foreground: 'var(--accent-foreground)',
45
+ },
46
+ destructive: {
47
+ DEFAULT: 'var(--destructive)',
48
+ foreground: 'var(--destructive-foreground)',
49
+ },
50
+ border: 'var(--border)',
51
+ input: 'var(--input)',
52
+ ring: 'var(--ring)',
53
+ // Surfaces
54
+ surface: {
55
+ DEFAULT: 'var(--surface)',
56
+ elevated: 'var(--surface-elevated)',
57
+ sunken: 'var(--surface-sunken)',
58
+ },
59
+ // Status colors
60
+ success: {
61
+ DEFAULT: 'var(--success)',
62
+ foreground: 'var(--success-foreground)',
63
+ },
64
+ warning: {
65
+ DEFAULT: 'var(--warning)',
66
+ foreground: 'var(--warning-foreground)',
67
+ },
68
+ error: {
69
+ DEFAULT: 'var(--error)',
70
+ foreground: 'var(--error-foreground)',
71
+ },
72
+ info: {
73
+ DEFAULT: 'var(--info)',
74
+ foreground: 'var(--info-foreground)',
75
+ },
76
+ },
77
+ borderRadius: {
78
+ sm: 'var(--radius-sm)',
79
+ DEFAULT: 'var(--radius)',
80
+ md: 'var(--radius-md)',
81
+ lg: 'var(--radius-lg)',
82
+ xl: 'var(--radius-xl)',
83
+ full: 'var(--radius-full)',
84
+ },
85
+ boxShadow: {
86
+ sm: 'var(--shadow-sm)',
87
+ DEFAULT: 'var(--shadow)',
88
+ md: 'var(--shadow-md)',
89
+ lg: 'var(--shadow-lg)',
90
+ xl: 'var(--shadow-xl)',
91
+ },
92
+ transitionDuration: {
93
+ fast: 'var(--transition-fast)',
94
+ normal: 'var(--transition-normal)',
95
+ slow: 'var(--transition-slow)',
96
+ },
97
+ spacing: {
98
+ 'sidebar': 'var(--sidebar-width)',
99
+ 'sidebar-collapsed': 'var(--sidebar-collapsed-width)',
100
+ 'topbar': 'var(--topbar-height)',
101
+ 'page-header': 'var(--page-header-height)',
102
+ },
103
+ keyframes: {
104
+ 'accordion-down': {
105
+ from: { height: '0' },
106
+ to: { height: 'var(--radix-accordion-content-height)' },
107
+ },
108
+ 'accordion-up': {
109
+ from: { height: 'var(--radix-accordion-content-height)' },
110
+ to: { height: '0' },
111
+ },
112
+ 'collapsible-down': {
113
+ from: { height: '0' },
114
+ to: { height: 'var(--radix-collapsible-content-height)' },
115
+ },
116
+ 'collapsible-up': {
117
+ from: { height: 'var(--radix-collapsible-content-height)' },
118
+ to: { height: '0' },
119
+ },
120
+ },
121
+ animation: {
122
+ 'accordion-down': 'accordion-down 0.2s ease-out',
123
+ 'accordion-up': 'accordion-up 0.2s ease-out',
124
+ 'collapsible-down': 'collapsible-down 0.2s ease-out',
125
+ 'collapsible-up': 'collapsible-up 0.2s ease-out',
126
+ },
127
+ },
128
+ },
129
+ plugins: [require('tailwindcss-animate')],
130
+ };