@djangocfg/ui-core 2.1.202 → 2.1.204

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": "@djangocfg/ui-core",
3
- "version": "2.1.202",
3
+ "version": "2.1.204",
4
4
  "description": "Pure React UI component library without Next.js dependencies - for Electron, Vite, CRA apps",
5
5
  "keywords": [
6
6
  "ui-components",
@@ -81,7 +81,7 @@
81
81
  "playground": "playground dev"
82
82
  },
83
83
  "peerDependencies": {
84
- "@djangocfg/i18n": "^2.1.202",
84
+ "@djangocfg/i18n": "^2.1.204",
85
85
  "react-device-detect": "^2.2.3",
86
86
  "consola": "^3.4.2",
87
87
  "lucide-react": "^0.545.0",
@@ -143,9 +143,9 @@
143
143
  "vaul": "1.1.2"
144
144
  },
145
145
  "devDependencies": {
146
- "@djangocfg/i18n": "^2.1.202",
146
+ "@djangocfg/i18n": "^2.1.204",
147
147
  "@djangocfg/playground": "workspace:*",
148
- "@djangocfg/typescript-config": "^2.1.202",
148
+ "@djangocfg/typescript-config": "^2.1.204",
149
149
  "@types/node": "^24.7.2",
150
150
  "@types/react": "^19.1.0",
151
151
  "@types/react-dom": "^19.1.0",
@@ -134,6 +134,24 @@ export const HorizontalFilterTabs = () => (
134
134
  </div>
135
135
  );
136
136
 
137
+ export const VerticalNoHorizontalScroll = () => (
138
+ <div className="max-w-xs border rounded-lg">
139
+ <p className="text-sm font-medium p-3 border-b">overflowX="hidden" — no horizontal bleed</p>
140
+ <ScrollArea className="h-48" overflowX="hidden">
141
+ <div className="p-3 space-y-2">
142
+ {Array.from({ length: 10 }).map((_, i) => (
143
+ <div key={i} className="flex items-center gap-2 p-2 rounded-md bg-muted/40">
144
+ <div className="w-2 h-8 rounded-full bg-primary/50 flex-shrink-0" />
145
+ <span className="text-sm truncate flex-1 min-w-0">
146
+ Track name that is very long and should truncate gracefully {i + 1}
147
+ </span>
148
+ </div>
149
+ ))}
150
+ </div>
151
+ </ScrollArea>
152
+ </div>
153
+ );
154
+
137
155
  export const HorizontalChips = () => (
138
156
  <div className="max-w-xs">
139
157
  <p className="text-sm font-medium mb-2">Selected tags:</p>
@@ -30,10 +30,12 @@ export interface ScrollAreaProps
30
30
  viewportClassName?: string;
31
31
  /** Scroll orientation: vertical (default), horizontal, or both */
32
32
  orientation?: ScrollAreaOrientation;
33
+ /** Control horizontal overflow on the viewport (default: auto) */
34
+ overflowX?: 'auto' | 'hidden' | 'scroll';
33
35
  }
34
36
 
35
37
  const ScrollArea = React.forwardRef<ScrollAreaHandle, ScrollAreaProps>(
36
- ({ className, children, viewportRef, viewportClassName, orientation = 'vertical', ...props }, ref) => {
38
+ ({ className, children, viewportRef, viewportClassName, orientation = 'vertical', overflowX, ...props }, ref) => {
37
39
  const internalViewportRef = React.useRef<HTMLDivElement>(null);
38
40
  const actualViewportRef = viewportRef || internalViewportRef;
39
41
 
@@ -73,7 +75,12 @@ const ScrollArea = React.forwardRef<ScrollAreaHandle, ScrollAreaProps>(
73
75
  >
74
76
  <ScrollAreaPrimitive.Viewport
75
77
  ref={actualViewportRef as React.RefObject<HTMLDivElement>}
76
- className={cn("h-full w-full rounded-[inherit]", viewportClassName)}
78
+ className={cn(
79
+ "h-full w-full rounded-[inherit]",
80
+ overflowX === 'hidden' && "!overflow-x-hidden",
81
+ overflowX === 'scroll' && "!overflow-x-scroll",
82
+ viewportClassName,
83
+ )}
77
84
  >
78
85
  {children}
79
86
  </ScrollAreaPrimitive.Viewport>