@svp-chain-sdk/ui 0.1.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 +276 -0
- package/dist/button.d.ts +22 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +2324 -0
- package/dist/styles.css +2 -0
- package/dist/tailwind.d.ts +84 -0
- package/dist/tailwind.js +54 -0
- package/dist/utils.d.ts +2 -0
- package/package.json +60 -0
package/dist/styles.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
@import "tailwindcss";
|
|
2
|
+
@theme { --color-background: oklch(0.99 0.01 220); --color-foreground: oklch(0.24 0.04 235); --color-primary: oklch(0.55 0.16 220); --color-primary-foreground: oklch(0.99 0.01 220); --color-secondary: oklch(0.93 0.04 205); --color-secondary-foreground: oklch(0.28 0.07 225); --color-accent: oklch(0.9 0.06 195); --color-accent-foreground: oklch(0.25 0.07 225); --color-destructive: oklch(0.58 0.2 25); --color-destructive-foreground: white; --color-input: oklch(0.86 0.03 220); --color-ring: oklch(0.6 0.14 195); }
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
/** Explicit Tailwind component styles for the framework-agnostic button classes. */
|
|
2
|
+
export declare const uiButtonComponents: {
|
|
3
|
+
'.ui-button': {
|
|
4
|
+
display: string;
|
|
5
|
+
'align-items': string;
|
|
6
|
+
'justify-content': string;
|
|
7
|
+
gap: string;
|
|
8
|
+
'white-space': string;
|
|
9
|
+
'border-radius': string;
|
|
10
|
+
padding: string;
|
|
11
|
+
'font-size': string;
|
|
12
|
+
'line-height': string;
|
|
13
|
+
'font-weight': string;
|
|
14
|
+
transition: string;
|
|
15
|
+
'&:focus-visible': {
|
|
16
|
+
outline: string;
|
|
17
|
+
'outline-offset': string;
|
|
18
|
+
};
|
|
19
|
+
'&:disabled': {
|
|
20
|
+
'pointer-events': string;
|
|
21
|
+
opacity: string;
|
|
22
|
+
};
|
|
23
|
+
};
|
|
24
|
+
'.ui-button-primary': {
|
|
25
|
+
'background-color': string;
|
|
26
|
+
color: string;
|
|
27
|
+
'&:hover': {
|
|
28
|
+
'background-color': string;
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
'.ui-button-danger': {
|
|
32
|
+
'background-color': string;
|
|
33
|
+
color: string;
|
|
34
|
+
'&:hover': {
|
|
35
|
+
'background-color': string;
|
|
36
|
+
};
|
|
37
|
+
};
|
|
38
|
+
};
|
|
39
|
+
/** Complete component configuration registered by the default SVP UI plugin. */
|
|
40
|
+
export declare const uiComponents: {
|
|
41
|
+
'.ui-button': {
|
|
42
|
+
display: string;
|
|
43
|
+
'align-items': string;
|
|
44
|
+
'justify-content': string;
|
|
45
|
+
gap: string;
|
|
46
|
+
'white-space': string;
|
|
47
|
+
'border-radius': string;
|
|
48
|
+
padding: string;
|
|
49
|
+
'font-size': string;
|
|
50
|
+
'line-height': string;
|
|
51
|
+
'font-weight': string;
|
|
52
|
+
transition: string;
|
|
53
|
+
'&:focus-visible': {
|
|
54
|
+
outline: string;
|
|
55
|
+
'outline-offset': string;
|
|
56
|
+
};
|
|
57
|
+
'&:disabled': {
|
|
58
|
+
'pointer-events': string;
|
|
59
|
+
opacity: string;
|
|
60
|
+
};
|
|
61
|
+
};
|
|
62
|
+
'.ui-button-primary': {
|
|
63
|
+
'background-color': string;
|
|
64
|
+
color: string;
|
|
65
|
+
'&:hover': {
|
|
66
|
+
'background-color': string;
|
|
67
|
+
};
|
|
68
|
+
};
|
|
69
|
+
'.ui-button-danger': {
|
|
70
|
+
'background-color': string;
|
|
71
|
+
color: string;
|
|
72
|
+
'&:hover': {
|
|
73
|
+
'background-color': string;
|
|
74
|
+
};
|
|
75
|
+
};
|
|
76
|
+
};
|
|
77
|
+
/**
|
|
78
|
+
* Tailwind provider for the framework-agnostic SVP UI classes.
|
|
79
|
+
*
|
|
80
|
+
* Register this once in the consuming project's Tailwind configuration, then
|
|
81
|
+
* use `ui-button` classes from HTML, JSX, or any other markup.
|
|
82
|
+
*/
|
|
83
|
+
declare const svpUiPlugin: import("tailwindcss/plugin").PluginWithConfig;
|
|
84
|
+
export default svpUiPlugin;
|
package/dist/tailwind.js
ADDED
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
function e(o, r) {
|
|
2
|
+
return { handler: o, config: r };
|
|
3
|
+
}
|
|
4
|
+
e.withOptions = function(o, r = () => ({})) {
|
|
5
|
+
function n(t) {
|
|
6
|
+
return { handler: o(t), config: r(t) };
|
|
7
|
+
}
|
|
8
|
+
return n.__isOptionsFunction = !0, n;
|
|
9
|
+
};
|
|
10
|
+
var i = e;
|
|
11
|
+
const c = {
|
|
12
|
+
".ui-button": {
|
|
13
|
+
display: "inline-flex",
|
|
14
|
+
"align-items": "center",
|
|
15
|
+
"justify-content": "center",
|
|
16
|
+
gap: "0.5rem",
|
|
17
|
+
"white-space": "nowrap",
|
|
18
|
+
"border-radius": "0.375rem",
|
|
19
|
+
padding: "0.5rem 1rem",
|
|
20
|
+
"font-size": "0.875rem",
|
|
21
|
+
"line-height": "1.25rem",
|
|
22
|
+
"font-weight": "500",
|
|
23
|
+
transition: "background-color 150ms, color 150ms, border-color 150ms, opacity 150ms",
|
|
24
|
+
"&:focus-visible": {
|
|
25
|
+
outline: "2px solid var(--color-ring, #159bb5)",
|
|
26
|
+
"outline-offset": "2px"
|
|
27
|
+
},
|
|
28
|
+
"&:disabled": {
|
|
29
|
+
"pointer-events": "none",
|
|
30
|
+
opacity: "0.5"
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
".ui-button-primary": {
|
|
34
|
+
"background-color": "var(--color-primary, #159bb5)",
|
|
35
|
+
color: "var(--color-primary-foreground, white)",
|
|
36
|
+
"&:hover": {
|
|
37
|
+
"background-color": "color-mix(in srgb, var(--color-primary, #159bb5) 90%, transparent)"
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
".ui-button-danger": {
|
|
41
|
+
"background-color": "var(--color-destructive, #e5484d)",
|
|
42
|
+
color: "var(--color-destructive-foreground, white)",
|
|
43
|
+
"&:hover": {
|
|
44
|
+
"background-color": "color-mix(in srgb, var(--color-destructive, #e5484d) 90%, transparent)"
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
}, a = c, u = i(({ addBase: o, addComponents: r }) => {
|
|
48
|
+
o({ ":root": { "--svp-ui-brand": "#159bb5" } }), r(a);
|
|
49
|
+
});
|
|
50
|
+
export {
|
|
51
|
+
u as default,
|
|
52
|
+
c as uiButtonComponents,
|
|
53
|
+
a as uiComponents
|
|
54
|
+
};
|
package/dist/utils.d.ts
ADDED
package/package.json
ADDED
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@svp-chain-sdk/ui",
|
|
3
|
+
"version": "0.1.3",
|
|
4
|
+
"description": "Accessible UI primitives for SVP Chain SDK applications.",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"files": [
|
|
7
|
+
"dist"
|
|
8
|
+
],
|
|
9
|
+
"main": "./dist/index.js",
|
|
10
|
+
"module": "./dist/index.js",
|
|
11
|
+
"types": "./dist/index.d.ts",
|
|
12
|
+
"exports": {
|
|
13
|
+
".": {
|
|
14
|
+
"types": "./dist/index.d.ts",
|
|
15
|
+
"import": "./dist/index.js"
|
|
16
|
+
},
|
|
17
|
+
"./styles.css": "./dist/styles.css",
|
|
18
|
+
"./tailwind": {
|
|
19
|
+
"types": "./dist/tailwind.d.ts",
|
|
20
|
+
"import": "./dist/tailwind.js"
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"peerDependencies": {
|
|
24
|
+
"react": ">=18",
|
|
25
|
+
"react-dom": ">=18"
|
|
26
|
+
},
|
|
27
|
+
"dependencies": {
|
|
28
|
+
"@radix-ui/react-slot": "^1.1.2",
|
|
29
|
+
"class-variance-authority": "^0.7.1",
|
|
30
|
+
"clsx": "^2.1.1",
|
|
31
|
+
"tailwind-merge": "^2.6.0"
|
|
32
|
+
},
|
|
33
|
+
"devDependencies": {
|
|
34
|
+
"@testing-library/react": "^16.1.0",
|
|
35
|
+
"@testing-library/jest-dom": "^6.6.3",
|
|
36
|
+
"@types/react": "^19.0.0",
|
|
37
|
+
"@types/react-dom": "^19.0.0",
|
|
38
|
+
"@vitejs/plugin-react": "^4.3.4",
|
|
39
|
+
"jsdom": "^25.0.1",
|
|
40
|
+
"react": "^19.0.0",
|
|
41
|
+
"react-dom": "^19.0.0",
|
|
42
|
+
"tailwindcss": "^4.1.11",
|
|
43
|
+
"@tailwindcss/vite": "^4.1.11",
|
|
44
|
+
"@types/node": "^22.10.2",
|
|
45
|
+
"typescript": "^5.7.2",
|
|
46
|
+
"vite": "^6.0.5",
|
|
47
|
+
"vitest": "^2.1.8"
|
|
48
|
+
},
|
|
49
|
+
"scripts": {
|
|
50
|
+
"build": "rm -rf dist && vite build && vite build --config vite.tailwind.config.ts && cp src/styles.css dist/styles.css && tsc",
|
|
51
|
+
"typecheck": "tsc --noEmit",
|
|
52
|
+
"test": "vitest run",
|
|
53
|
+
"prepublishOnly": "npm run build && npm run typecheck && npm run test",
|
|
54
|
+
"publish:npm": "npm publish --access public",
|
|
55
|
+
"release": "node scripts/release.mjs",
|
|
56
|
+
"release:patch": "node scripts/release.mjs patch",
|
|
57
|
+
"release:minor": "node scripts/release.mjs minor",
|
|
58
|
+
"release:major": "node scripts/release.mjs major"
|
|
59
|
+
}
|
|
60
|
+
}
|