@customafk/lunas-ui 0.0.0-c → 0.0.0-e

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 (4) hide show
  1. package/dist/Atoms/index.js +8 -8
  2. package/dist/tailwindTheme.d.ts +132 -14
  3. package/dist/tailwindTheme.js +128 -15
  4. package/package.json +1 -1
package/dist/Atoms/index.js CHANGED
@@ -14,20 +14,20 @@ import { forwardRef } from "react";
14
14
  // packages/Atoms/Button/buttonVariants.ts
15
15
  import { cva } from "class-variance-authority";
16
16
  var buttonVariants = cva(
17
- "text-ui-white-primary flex items-center justify-center gap-1 rounded-md px-3 py-1 text-base font-semibold enabled:hover:opacity-80 enabled:active:opacity-100 disabled:cursor-not-allowed disabled:opacity-40",
17
+ "flex items-center justify-center gap-1 rounded-md px-3 py-1 text-base font-semibold text-ui-white-primary enabled:hover:opacity-80 enabled:active:opacity-100 disabled:cursor-not-allowed disabled:opacity-40",
18
18
  {
19
19
  variants: {
20
20
  variant: {
21
- default: "bg-ui-btn-primary enabled:active:shadow-ui-sd-primary enabled:active:opacity-95",
21
+ default: "bg-ui-btn-primary enabled:active:opacity-95 enabled:active:shadow-ui-sd-primary",
22
22
  secondary: "bg-ui-btn-secondary enabled:active:shadow-ui-sd-base",
23
- outline: "text-ui-primary border-ui-primary enabled:active:shadow-ui-sd-primary border border-solid enabled:active:opacity-80",
24
- ghost: "text-ui-primary bg-ui-white enabled:active:shadow-ui-sd-primary enabled:active:opacity-80",
23
+ outline: "border border-solid border-ui-primary text-ui-primary enabled:active:opacity-80 enabled:active:shadow-ui-sd-primary",
24
+ ghost: "bg-ui-white text-ui-primary enabled:active:opacity-80 enabled:active:shadow-ui-sd-primary",
25
25
  destructive: "bg-ui-btn-destructive text-ui-white-primary enabled:active:shadow-ui-sd-destructive",
26
- "destructive-outline": "text-ui-destruction-flat border-ui-destruction-flat enabled:active:shadow-ui-sd-destructive border border-solid",
27
- "destructive-ghost": "text-ui-destruction-flat border-ui-destruction-flat bg-ui-white enabled:active:shadow-ui-sd-destructive border border-solid disabled:opacity-60",
26
+ "destructive-outline": "border border-solid border-ui-destruction-flat text-ui-destruction-flat enabled:active:shadow-ui-sd-destructive",
27
+ "destructive-ghost": "border border-solid border-ui-destruction-flat bg-ui-white text-ui-destruction-flat enabled:active:shadow-ui-sd-destructive disabled:opacity-60",
28
28
  accept: "bg-ui-btn-accept text-ui-white-primary enabled:active:shadow-ui-sd-accept",
29
- "accept-outline": "text-ui-positive-flat border-ui-positive-flat bg-ui-white enabled:active:shadow-ui-sd-accept border border-solid",
30
- normal: "border-ui-black bg-ui-white text-ui-black enabled:active:shadow-ui-xl border border-solid"
29
+ "accept-outline": "border border-solid border-ui-positive-flat bg-ui-white text-ui-positive-flat enabled:active:shadow-ui-sd-accept",
30
+ normal: "border-ui-black text-ui-black border border-solid bg-ui-white enabled:active:shadow-ui-xl"
31
31
  },
32
32
  size: {
33
33
  default: ""
package/dist/tailwindTheme.d.ts CHANGED
@@ -1,24 +1,131 @@
1
+ /** @type {import('tailwindcss/types/config').CustomThemeConfig} */
1
2
  var tailwindTheme = {
2
3
  colors: {
3
- 'ui-white': '#F8F8F8',
4
- 'ui-white-primary': '#FDFDFD',
5
- 'ui-black-primary': '#111315',
6
- 'ui-primary': '#6C70F0',
7
- 'ui-destruction-flat': '#EF4444',
8
- 'ui-positive-flat': '#4ADE80',
9
- 'ui-text-primary': '#111315',
10
- 'ui-text-secondary': '#30353C',
11
- 'ui-text-third': '#30353CCC',
12
- 'ui-text-placeholder': '#11131566',
13
- 'ui-text-white-primary': '#FDFDFD',
14
- 'ui-text-white-secondary': '#FDFDFDCC',
15
- 'ui-text-white-placeholder': '#FDFDFD99',
4
+ ui: {
5
+ white: '#F8F8F8',
6
+ 'white-primary': '#FDFDFD',
7
+ 'black-primary': '#111315',
8
+ 'bg-white': '#F9F9F9',
9
+ primary: {
10
+ default: '#6C70F0',
11
+ 50: '#EEF2FF',
12
+ 100: '#E0E7FF',
13
+ 200: '#C8D2FD',
14
+ 300: '#A6B6FB',
15
+ 400: '#828EF7',
16
+ 500: '#6C70F0',
17
+ 600: '#5048E3',
18
+ 700: '#443AC8',
19
+ 800: '#3731A2',
20
+ 900: '#312F80',
21
+ 950: '#1F1C4A',
22
+ },
23
+ secondary: {
24
+ default: '#AE54F5',
25
+ 50: '#FAF5FF',
26
+ 100: '#F4E8FF',
27
+ 200: '#EBD5FF',
28
+ 300: '#DBB5FD',
29
+ 400: '#C685FB',
30
+ 500: '#AE54F5',
31
+ 600: '#9B35E8',
32
+ 700: '#8624CC',
33
+ 800: '#7123A6',
34
+ 900: '#5D1D86',
35
+ 950: '#3F0863',
36
+ },
37
+ tertiary: {
38
+ default: '#4277EF',
39
+ 50: '#F0F5FE',
40
+ 100: '#DCE8FD',
41
+ 200: '#C1D7FC',
42
+ 300: '#84B2F8',
43
+ 400: '#669BF4',
44
+ 500: '#4277EF',
45
+ 600: '#2C58E4',
46
+ 700: '#2444D1',
47
+ 800: '#2339AA',
48
+ 900: '#223486',
49
+ 950: '#192252',
50
+ },
51
+ text: {
52
+ black: '#19191B',
53
+ white: '#F7F7F8',
54
+ 50: '#F7F7F8',
55
+ 100: '#EEEEF0',
56
+ 200: '#DADADD',
57
+ 300: '#B9BAC0',
58
+ 400: '#93949D',
59
+ 500: '#767681',
60
+ 600: '#606169',
61
+ 700: '#4E4E56',
62
+ 800: '#434349',
63
+ 900: '#3B3C3F',
64
+ 950: '#19191B',
65
+ },
66
+ destructive: {
67
+ default: '#EF4444',
68
+ 50: '#FEF2F2',
69
+ 100: '#FEE2E2',
70
+ 200: '#FECACA',
71
+ 300: '#FCA5A5',
72
+ 400: '#F87171',
73
+ 500: '#EF4444',
74
+ 600: '#DC2626',
75
+ 700: '#B91C1C',
76
+ 800: '#991B1B',
77
+ 900: '#7F1D1D',
78
+ 950: '#450A0A',
79
+ },
80
+
81
+ // TEXT COLOR
82
+ 'text-primary': '#111315',
83
+ 'text-secondary': '#30353C',
84
+ 'text-third': '#30353CCC',
85
+ 'text-placeholder': '#11131566',
86
+ 'text-white-placeholder': '#FDFDFD99',
87
+ 'text-black': {
88
+ primary: '#19191B',
89
+ secondary: '#222325',
90
+ third: '#292A2E',
91
+ fourth: '#5F606A',
92
+ placeholder: '#B2B3BD',
93
+ },
94
+ 'text-white': {
95
+ primary: '#FCFCFC',
96
+ secondary: '#F9F9F9',
97
+ third: '#D9D9D9',
98
+ },
99
+
100
+ // COLOR SPECIAL
101
+ 'positive-flat': '#4ADE80',
102
+ 'destruction-flat': '#EF4444',
103
+ 'neutral-flat': '#BFDBFE',
104
+ rating: '#FDE047',
105
+ input: {
106
+ border: {
107
+ active: '#71717A',
108
+ disabled: '#D4D4D8',
109
+ },
110
+ bg: {
111
+ default: '#FDFDFD',
112
+ error: '#FEF2F2',
113
+ },
114
+ },
115
+ },
16
116
  },
17
117
  backgroundImage: {
118
+ 'ui-bg-color':
119
+ 'linear-gradient(110deg, #9CD5F5 3.09%, #B1B8E6 33.47%, rgba(185, 155, 215, 0.90) 62.82%, #A293DF 84.45%, #878AEA 106.08%)',
120
+ 'ui-bg-page':
121
+ 'radial-gradient(70.47% 70.47% at 50% 50%, #FDFDFD 0%, #F3F1FF 50%, #F1FCFF 100%)',
18
122
  'ui-btn-primary': 'linear-gradient(180deg, #9EA1FF 0%, #607DE8 100%)',
19
123
  'ui-btn-secondary': 'linear-gradient(180deg, #5E7FF1 0%, #8FDDFF 100%)',
20
- 'ui-btn-destructive': 'linear-gradient(282deg, #FF384A 7.07%, #FF5463 92.93%)',
21
124
  'ui-btn-accept': 'linear-gradient(282deg, #30C36D 6.81%, #6BCD8A 93.19%)',
125
+ 'ui-btn-destructive': 'linear-gradient(282deg, #FF384A 7.07%, #FF5463 92.93%)',
126
+ 'ui-status-bg-positive': 'linear-gradient(0deg, #C4FFD8 0%, #68FF9D 100%)',
127
+ 'ui-status-bg-negative': 'linear-gradient(0deg, #FECACA 0%, #FF8F8F 100%)',
128
+ 'ui-status-bg-neutral': 'linear-gradient(0deg, #E1EBFF 0%, #C7E8FF 100%)',
22
129
  },
23
130
  boxShadow: {
24
131
  'ui-sd-primary': '0 4px 20px 0 rgba(104, 109, 224, 0.5)',
@@ -26,6 +133,17 @@ var tailwindTheme = {
26
133
  'ui-sd-destructive': '0 10px 10px 0 rgba(255, 56, 74, 0.15)',
27
134
  'ui-sd-accept': '0 10px 10px 0 rgba(46, 213, 115, 0.15)',
28
135
  'ui-xl': '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
136
+ 'ui-soft': '0px 5px 50px 0px rgba(0, 67, 101, 0.08)',
137
+ 'ui-muli': '0px 5px 50px 0px rgba(0, 67, 101, 0.08), 0px 2px 6px 0px rgba(130, 169, 188, 0.08)',
138
+ 'ui-category-effect': '0px 4px 50px 0px rgba(0, 67, 101, 0.08)',
139
+ },
140
+ fontSize: {
141
+ 'ui-h1': ['1.5rem', '2rem'],
142
+ 'ui-h2': ['1.25rem', '1.75rem'],
143
+ 'ui-h3': ['1.125rem', '1.75rem'],
144
+ 'ui-p': ['1rem', '1.5rem'],
145
+ 'ui-note': ['0.875rem', '1.25rem'],
146
+ 'ui-small-note': ['0.75rem', '1rem'],
29
147
  },
30
148
  };
31
149
 
package/dist/tailwindTheme.js CHANGED
@@ -1,32 +1,145 @@
1
1
  // packages/tailwindTheme.js
2
2
  var tailwindTheme_default = {
3
3
  colors: {
4
- "ui-white": "#F8F8F8",
5
- "ui-white-primary": "#FDFDFD",
6
- "ui-black-primary": "#111315",
7
- "ui-primary": "#6C70F0",
8
- "ui-destruction-flat": "#EF4444",
9
- "ui-positive-flat": "#4ADE80",
10
- "ui-text-primary": "#111315",
11
- "ui-text-secondary": "#30353C",
12
- "ui-text-third": "#30353CCC",
13
- "ui-text-placeholder": "#11131566",
14
- "ui-text-white-primary": "#FDFDFD",
15
- "ui-text-white-secondary": "#FDFDFDCC",
16
- "ui-text-white-placeholder": "#FDFDFD99"
4
+ ui: {
5
+ white: "#F8F8F8",
6
+ "white-primary": "#FDFDFD",
7
+ "black-primary": "#111315",
8
+ "bg-white": "#F9F9F9",
9
+ primary: {
10
+ default: "#6C70F0",
11
+ 50: "#EEF2FF",
12
+ 100: "#E0E7FF",
13
+ 200: "#C8D2FD",
14
+ 300: "#A6B6FB",
15
+ 400: "#828EF7",
16
+ 500: "#6C70F0",
17
+ 600: "#5048E3",
18
+ 700: "#443AC8",
19
+ 800: "#3731A2",
20
+ 900: "#312F80",
21
+ 950: "#1F1C4A"
22
+ },
23
+ secondary: {
24
+ default: "#AE54F5",
25
+ 50: "#FAF5FF",
26
+ 100: "#F4E8FF",
27
+ 200: "#EBD5FF",
28
+ 300: "#DBB5FD",
29
+ 400: "#C685FB",
30
+ 500: "#AE54F5",
31
+ 600: "#9B35E8",
32
+ 700: "#8624CC",
33
+ 800: "#7123A6",
34
+ 900: "#5D1D86",
35
+ 950: "#3F0863"
36
+ },
37
+ tertiary: {
38
+ default: "#4277EF",
39
+ 50: "#F0F5FE",
40
+ 100: "#DCE8FD",
41
+ 200: "#C1D7FC",
42
+ 300: "#84B2F8",
43
+ 400: "#669BF4",
44
+ 500: "#4277EF",
45
+ 600: "#2C58E4",
46
+ 700: "#2444D1",
47
+ 800: "#2339AA",
48
+ 900: "#223486",
49
+ 950: "#192252"
50
+ },
51
+ text: {
52
+ black: "#19191B",
53
+ white: "#F7F7F8",
54
+ 50: "#F7F7F8",
55
+ 100: "#EEEEF0",
56
+ 200: "#DADADD",
57
+ 300: "#B9BAC0",
58
+ 400: "#93949D",
59
+ 500: "#767681",
60
+ 600: "#606169",
61
+ 700: "#4E4E56",
62
+ 800: "#434349",
63
+ 900: "#3B3C3F",
64
+ 950: "#19191B"
65
+ },
66
+ destructive: {
67
+ default: "#EF4444",
68
+ 50: "#FEF2F2",
69
+ 100: "#FEE2E2",
70
+ 200: "#FECACA",
71
+ 300: "#FCA5A5",
72
+ 400: "#F87171",
73
+ 500: "#EF4444",
74
+ 600: "#DC2626",
75
+ 700: "#B91C1C",
76
+ 800: "#991B1B",
77
+ 900: "#7F1D1D",
78
+ 950: "#450A0A"
79
+ },
80
+ // TEXT COLOR
81
+ "text-primary": "#111315",
82
+ "text-secondary": "#30353C",
83
+ "text-third": "#30353CCC",
84
+ "text-placeholder": "#11131566",
85
+ "text-white-placeholder": "#FDFDFD99",
86
+ "text-black": {
87
+ primary: "#19191B",
88
+ secondary: "#222325",
89
+ third: "#292A2E",
90
+ fourth: "#5F606A",
91
+ placeholder: "#B2B3BD"
92
+ },
93
+ "text-white": {
94
+ primary: "#FCFCFC",
95
+ secondary: "#F9F9F9",
96
+ third: "#D9D9D9"
97
+ },
98
+ // COLOR SPECIAL
99
+ "positive-flat": "#4ADE80",
100
+ "destruction-flat": "#EF4444",
101
+ "neutral-flat": "#BFDBFE",
102
+ rating: "#FDE047",
103
+ input: {
104
+ border: {
105
+ active: "#71717A",
106
+ disabled: "#D4D4D8"
107
+ },
108
+ bg: {
109
+ default: "#FDFDFD",
110
+ error: "#FEF2F2"
111
+ }
112
+ }
113
+ }
17
114
  },
18
115
  backgroundImage: {
116
+ "ui-bg-color": "linear-gradient(110deg, #9CD5F5 3.09%, #B1B8E6 33.47%, rgba(185, 155, 215, 0.90) 62.82%, #A293DF 84.45%, #878AEA 106.08%)",
117
+ "ui-bg-page": "radial-gradient(70.47% 70.47% at 50% 50%, #FDFDFD 0%, #F3F1FF 50%, #F1FCFF 100%)",
19
118
  "ui-btn-primary": "linear-gradient(180deg, #9EA1FF 0%, #607DE8 100%)",
20
119
  "ui-btn-secondary": "linear-gradient(180deg, #5E7FF1 0%, #8FDDFF 100%)",
120
+ "ui-btn-accept": "linear-gradient(282deg, #30C36D 6.81%, #6BCD8A 93.19%)",
21
121
  "ui-btn-destructive": "linear-gradient(282deg, #FF384A 7.07%, #FF5463 92.93%)",
22
- "ui-btn-accept": "linear-gradient(282deg, #30C36D 6.81%, #6BCD8A 93.19%)"
122
+ "ui-status-bg-positive": "linear-gradient(0deg, #C4FFD8 0%, #68FF9D 100%)",
123
+ "ui-status-bg-negative": "linear-gradient(0deg, #FECACA 0%, #FF8F8F 100%)",
124
+ "ui-status-bg-neutral": "linear-gradient(0deg, #E1EBFF 0%, #C7E8FF 100%)"
23
125
  },
24
126
  boxShadow: {
25
127
  "ui-sd-primary": "0 4px 20px 0 rgba(104, 109, 224, 0.5)",
26
128
  "ui-sd-base": "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
27
129
  "ui-sd-destructive": "0 10px 10px 0 rgba(255, 56, 74, 0.15)",
28
130
  "ui-sd-accept": "0 10px 10px 0 rgba(46, 213, 115, 0.15)",
29
- "ui-xl": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)"
131
+ "ui-xl": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
132
+ "ui-soft": "0px 5px 50px 0px rgba(0, 67, 101, 0.08)",
133
+ "ui-muli": "0px 5px 50px 0px rgba(0, 67, 101, 0.08), 0px 2px 6px 0px rgba(130, 169, 188, 0.08)",
134
+ "ui-category-effect": "0px 4px 50px 0px rgba(0, 67, 101, 0.08)"
135
+ },
136
+ fontSize: {
137
+ "ui-h1": ["1.5rem", "2rem"],
138
+ "ui-h2": ["1.25rem", "1.75rem"],
139
+ "ui-h3": ["1.125rem", "1.75rem"],
140
+ "ui-p": ["1rem", "1.5rem"],
141
+ "ui-note": ["0.875rem", "1.25rem"],
142
+ "ui-small-note": ["0.75rem", "1rem"]
30
143
  }
31
144
  };
32
145
  export {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@customafk/lunas-ui",
3
3
  "private": false,
4
- "version": "0.0.0-c",
4
+ "version": "0.0.0-e",
5
5
  "type": "module",
6
6
  "homepage": "https://docs.customafk.com",
7
7
  "repository": {