@olwiba/ui 0.1.7 → 0.1.8
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/dist/index.js +9 -1
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/components/FlowBracket.tsx +10 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@olwiba/ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.8",
|
|
4
4
|
"private": false,
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -41,7 +41,6 @@
|
|
|
41
41
|
"@dnd-kit/modifiers": "^9.0.0",
|
|
42
42
|
"@dnd-kit/sortable": "^10.0.0",
|
|
43
43
|
"@dnd-kit/utilities": "^3.2.2",
|
|
44
|
-
"@olwiba/docs": "0.1.29",
|
|
45
44
|
"@olwiba/dx": "0.0.18",
|
|
46
45
|
"@tanstack/react-table": "^8.21.3",
|
|
47
46
|
"clsx": "^2.1.1",
|
|
@@ -65,6 +64,7 @@
|
|
|
65
64
|
"devDependencies": {
|
|
66
65
|
"@content-collections/mdx": "^0.2.2",
|
|
67
66
|
"@olwiba/cn": "0.1.21",
|
|
67
|
+
"@olwiba/docs": "0.1.29",
|
|
68
68
|
"@tailwindcss/vite": "^4.1.18",
|
|
69
69
|
"@tanstack/react-router": "1.154.8",
|
|
70
70
|
"@tanstack/react-router-devtools": "1.154.8",
|
|
@@ -90,6 +90,7 @@ export function FlowBracket({
|
|
|
90
90
|
// CSS dot: extent as % of container width
|
|
91
91
|
const ep = `${(extent / 10).toFixed(1)}%`;
|
|
92
92
|
// Dots travel bottom → top (sync → genesis/docs direction), fade in/out at card edges
|
|
93
|
+
// fb-drr: reversed — top → bottom (docs → sync direction) used when reverseRight=true
|
|
93
94
|
const dotKeyframes = animate ? `
|
|
94
95
|
@keyframes fb-dl{
|
|
95
96
|
0%{top:${anchorBottom}%;left:0;opacity:0}
|
|
@@ -106,6 +107,14 @@ export function FlowBracket({
|
|
|
106
107
|
80%{top:${anchorTop}%;left:calc(100% + ${ep});opacity:1}
|
|
107
108
|
94%{top:${anchorTop}%;left:100%;opacity:0}
|
|
108
109
|
100%{top:${anchorTop}%;left:100%;opacity:0}
|
|
110
|
+
}
|
|
111
|
+
@keyframes fb-drr{
|
|
112
|
+
0%{top:${anchorTop}%;left:100%;opacity:0}
|
|
113
|
+
6%{opacity:1}
|
|
114
|
+
20%{top:${anchorTop}%;left:calc(100% + ${ep})}
|
|
115
|
+
80%{top:${anchorBottom}%;left:calc(100% + ${ep});opacity:1}
|
|
116
|
+
94%{top:${anchorBottom}%;left:100%;opacity:0}
|
|
117
|
+
100%{top:${anchorBottom}%;left:100%;opacity:0}
|
|
109
118
|
}` : '';
|
|
110
119
|
|
|
111
120
|
const dotBase: React.CSSProperties = {
|
|
@@ -158,7 +167,7 @@ export function FlowBracket({
|
|
|
158
167
|
{animate && right && (
|
|
159
168
|
<div
|
|
160
169
|
aria-hidden
|
|
161
|
-
style={{ ...dotBase, backgroundColor: cr, animation:
|
|
170
|
+
style={{ ...dotBase, backgroundColor: cr, animation: `${reverseRight ? 'fb-drr' : 'fb-dr'} ${animateDur} ease-in-out 1.8s infinite` }}
|
|
162
171
|
/>
|
|
163
172
|
)}
|
|
164
173
|
</div>
|