@uniweb/kit 0.2.1 → 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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uniweb/kit",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.3",
|
|
4
4
|
"description": "Standard component library for Uniweb foundations",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"exports": {
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"tailwind-merge": "^2.6.0",
|
|
40
|
-
"@uniweb/core": "0.2.
|
|
40
|
+
"@uniweb/core": "0.2.3"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
43
43
|
"react": "^18.0.0 || ^19.0.0",
|
|
@@ -12,6 +12,7 @@ import { cn } from '../../utils/index.js'
|
|
|
12
12
|
import { SafeHtml } from '../../components/SafeHtml/index.js'
|
|
13
13
|
import { Image } from '../../components/Image/index.js'
|
|
14
14
|
import { Media } from '../../components/Media/index.js'
|
|
15
|
+
import { Icon } from '../../components/Icon/index.js'
|
|
15
16
|
import { Link } from '../../components/Link/index.js'
|
|
16
17
|
import { Code } from './renderers/Code.jsx'
|
|
17
18
|
import { Alert } from './renderers/Alert.jsx'
|
|
@@ -94,7 +95,80 @@ function RenderNode({ node, ...props }) {
|
|
|
94
95
|
const src = attrs?.src || ''
|
|
95
96
|
const alt = attrs?.alt || ''
|
|
96
97
|
const caption = attrs?.caption || ''
|
|
98
|
+
const role = attrs?.role
|
|
97
99
|
|
|
100
|
+
// Dispatch based on role attribute
|
|
101
|
+
if (role === 'video') {
|
|
102
|
+
// Video content - use Media component
|
|
103
|
+
return (
|
|
104
|
+
<Media
|
|
105
|
+
src={src}
|
|
106
|
+
autoplay={attrs?.autoplay}
|
|
107
|
+
muted={attrs?.muted}
|
|
108
|
+
loop={attrs?.loop}
|
|
109
|
+
controls={attrs?.controls}
|
|
110
|
+
className="my-4 rounded-lg overflow-hidden"
|
|
111
|
+
/>
|
|
112
|
+
)
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
if (role === 'document') {
|
|
116
|
+
// Document/file link with optional preview
|
|
117
|
+
const poster = attrs?.poster
|
|
118
|
+
const preview = attrs?.preview
|
|
119
|
+
const filename = alt || src.split('/').pop() || 'Document'
|
|
120
|
+
|
|
121
|
+
return (
|
|
122
|
+
<figure className="my-4">
|
|
123
|
+
<Link
|
|
124
|
+
to={src}
|
|
125
|
+
className="block group border rounded-lg overflow-hidden hover:shadow-md transition-shadow"
|
|
126
|
+
target="_blank"
|
|
127
|
+
>
|
|
128
|
+
{(poster || preview) ? (
|
|
129
|
+
<Image
|
|
130
|
+
src={poster || preview}
|
|
131
|
+
alt={filename}
|
|
132
|
+
className="w-full"
|
|
133
|
+
/>
|
|
134
|
+
) : (
|
|
135
|
+
<div className="flex items-center gap-3 p-4 bg-gray-50">
|
|
136
|
+
<Icon name="download" size="24" className="text-gray-500" />
|
|
137
|
+
<span className="text-blue-600 group-hover:underline">
|
|
138
|
+
{filename}
|
|
139
|
+
</span>
|
|
140
|
+
</div>
|
|
141
|
+
)}
|
|
142
|
+
</Link>
|
|
143
|
+
{caption && (
|
|
144
|
+
<figcaption className="mt-2 text-sm text-gray-500 text-center">
|
|
145
|
+
{caption}
|
|
146
|
+
</figcaption>
|
|
147
|
+
)}
|
|
148
|
+
</figure>
|
|
149
|
+
)
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
if (role === 'icon') {
|
|
153
|
+
// Icon - use Icon component
|
|
154
|
+
// Supports: {size=24 color=blue}
|
|
155
|
+
// {size=32}
|
|
156
|
+
const size = attrs?.size || '24'
|
|
157
|
+
const iconName = attrs?.name || alt
|
|
158
|
+
const iconColor = attrs?.color
|
|
159
|
+
|
|
160
|
+
return (
|
|
161
|
+
<Icon
|
|
162
|
+
url={src}
|
|
163
|
+
name={iconName}
|
|
164
|
+
size={size}
|
|
165
|
+
color={iconColor}
|
|
166
|
+
className="inline-block"
|
|
167
|
+
/>
|
|
168
|
+
)
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
// Default: image or banner - use Image component
|
|
98
172
|
return (
|
|
99
173
|
<figure className="my-4">
|
|
100
174
|
<Image src={src} alt={alt} className="rounded-lg" />
|