@mastra/playground-ui 37.0.1-alpha.0 → 37.0.1-alpha.1
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/CHANGELOG.md +9 -0
- package/dist/components/Columns.cjs.js +1 -1
- package/dist/components/Columns.es.js +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.es.js +1 -1
- package/dist/{multi-column-B9TVKcLl.cjs → multi-column-BLp7eL6P.cjs} +1 -2
- package/dist/{multi-column-B9TVKcLl.cjs.map → multi-column-BLp7eL6P.cjs.map} +1 -1
- package/dist/{multi-column-p8sEagdM.js → multi-column-DeSb1YDE.js} +1 -2
- package/dist/{multi-column-p8sEagdM.js.map → multi-column-DeSb1YDE.js.map} +1 -1
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @mastra/playground-ui
|
|
2
2
|
|
|
3
|
+
## 37.0.1-alpha.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies [[`95857bc`](https://github.com/mastra-ai/mastra/commit/95857bcd6669da7193f503e803f0d72a2bd66be6), [`8e9c0fb`](https://github.com/mastra-ai/mastra/commit/8e9c0fb48fd58da2efcdff2cf1202ee41092c315)]:
|
|
8
|
+
- @mastra/core@1.48.0-alpha.1
|
|
9
|
+
- @mastra/client-js@1.28.1-alpha.1
|
|
10
|
+
- @mastra/react@1.2.1-alpha.1
|
|
11
|
+
|
|
3
12
|
## 37.0.1-alpha.0
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { C as Column, a as Columns, M as MultiColumn } from '../multi-column-
|
|
1
|
+
export { C as Column, a as Columns, M as MultiColumn } from '../multi-column-DeSb1YDE.js';
|
|
2
2
|
//# sourceMappingURL=Columns.es.js.map
|
package/dist/index.cjs.js
CHANGED
|
@@ -81,7 +81,7 @@ const tabsTab = require('./tabs-tab-CkHDocn9.cjs');
|
|
|
81
81
|
const tabsContent = require('./tabs-content-De3TzqG0.cjs');
|
|
82
82
|
const getShortId = require('./get-short-id-BD2mSqtQ.cjs');
|
|
83
83
|
const contentBlock = require('./content-block-Csb01oxE.cjs');
|
|
84
|
-
const multiColumn = require('./multi-column-
|
|
84
|
+
const multiColumn = require('./multi-column-BLp7eL6P.cjs');
|
|
85
85
|
const codeDiff = require('./code-diff-C2vuR6Ti.cjs');
|
|
86
86
|
const helpers = require('./helpers-DZjuFmIz.cjs');
|
|
87
87
|
const Notice = require('./Notice-BoWYUdbS.cjs');
|
package/dist/index.es.js
CHANGED
|
@@ -84,7 +84,7 @@ import { b as Tabs, a as TabList, T as Tab } from './tabs-tab-D0Ydz5KC.js';
|
|
|
84
84
|
import { T as TabContent } from './tabs-content-J4YUF8-A.js';
|
|
85
85
|
export { T as TextAndIcon, g as getShortId } from './get-short-id-ZED99MfC.js';
|
|
86
86
|
export { C as ContentBlock, a as ContentBlocks } from './content-block-BTpK7gPz.js';
|
|
87
|
-
export { C as Column, a as Columns, M as MultiColumn } from './multi-column-
|
|
87
|
+
export { C as Column, a as Columns, M as MultiColumn } from './multi-column-DeSb1YDE.js';
|
|
88
88
|
import { C as CodeDiff } from './code-diff-lktH1err.js';
|
|
89
89
|
export { I as ItemList, a as ItemListSkeleton, g as getItemListColumnTemplate, b as getToNextItemFn, c as getToPreviousItemFn } from './helpers-CsdqE6P2.js';
|
|
90
90
|
import { N as Notice } from './Notice-BJ6lke5l.js';
|
|
@@ -5,7 +5,6 @@ require('./index.css');const jsxRuntime = require('react/jsx-runtime');
|
|
|
5
5
|
require('@base-ui/react/combobox');
|
|
6
6
|
require('./components/DataDetailsPanel.cjs.js');
|
|
7
7
|
const React = require('react');
|
|
8
|
-
require('./toast-Bh4WQDyj.cjs');
|
|
9
8
|
const utils_cn = require('./cn-vA5sWo9W.cjs');
|
|
10
9
|
const lucideReact = require('lucide-react');
|
|
11
10
|
const Button = require('./Button-Bj667lJx.cjs');
|
|
@@ -134,4 +133,4 @@ function ScrollArrow({ direction, onClick }) {
|
|
|
134
133
|
exports.Column = Column;
|
|
135
134
|
exports.Columns = Columns;
|
|
136
135
|
exports.MultiColumn = MultiColumn;
|
|
137
|
-
//# sourceMappingURL=multi-column-
|
|
136
|
+
//# sourceMappingURL=multi-column-BLp7eL6P.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multi-column-B9TVKcLl.cjs","sources":["../src/ds/components/Columns/column-content.tsx","../src/ds/components/Columns/column-root.tsx","../src/ds/components/Columns/column-toolbar.tsx","../src/ds/components/Columns/column.tsx","../src/ds/components/Columns/columns.tsx","../src/ds/components/Columns/multi-column.tsx"],"sourcesContent":["import { cn } from '@/index';\n\nexport type ColumnProps = {\n children?: React.ReactNode;\n className?: string;\n};\n\nexport function ColumnContent({ children, className }: ColumnProps) {\n return <div className={cn(`grid overflow-y-auto gap-8 content-start`, className)}>{children}</div>;\n}\n","import { cn } from '@/index';\n\nexport type ColumnProps = {\n children: React.ReactNode;\n className?: string;\n withRightSeparator?: boolean;\n withLeftSeparator?: boolean;\n};\n\nexport function ColumnRoot({ children, className, withLeftSeparator, withRightSeparator }: ColumnProps) {\n return (\n <div className=\"flex overflow-y-auto w-full\">\n {withLeftSeparator && <Separator />}\n\n <div className={cn(`grid gap-8 content-start w-full overflow-y-auto`, className)}>{children}</div>\n\n {withRightSeparator && <Separator />}\n </div>\n );\n}\n\nfunction Separator() {\n return <div className={cn('bg-surface5 w-[3px] shrink-0 mx-[1.5vw]')}></div>;\n}\n","import { cn } from '@/index';\n\nexport type ColumnToolbarProps = {\n children?: React.ReactNode;\n className?: string;\n};\n\nexport function ColumnToolbar({ children, className }: ColumnToolbarProps) {\n return (\n <div className={cn(`flex items-center justify-between w-full flex-wrap gap-4 gap-x-6`, className)}>{children}</div>\n );\n}\n","import { ColumnContent } from './column-content';\nimport { ColumnRoot } from './column-root';\nimport { ColumnToolbar } from './column-toolbar';\n\nexport const Column = Object.assign(ColumnRoot, {\n Content: ColumnContent,\n Toolbar: ColumnToolbar,\n});\n","import { cn } from '@/index';\n\nexport type ColumnsProps = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport function Columns({ children, className }: ColumnsProps) {\n return <div className={cn(`grid w-full h-full grid-cols-1 overflow-y-auto`, className)}>{children}</div>;\n}\n","'use client';\n\nimport { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { Button } from '../Button';\nimport { cn } from '@/lib/utils';\n\nexport type MultiColumnProps = {\n children?: React.ReactNode;\n numOfColumns?: number;\n minColumnWidth?: string;\n};\n\nexport function MultiColumn({ children, numOfColumns = 1, minColumnWidth }: MultiColumnProps): React.JSX.Element {\n const scrollRef = useRef<HTMLDivElement>(null);\n const [canScrollLeft, setCanScrollLeft] = useState(false);\n const [canScrollRight, setCanScrollRight] = useState(false);\n const updateScrollState = useCallback(() => {\n const el = scrollRef.current;\n if (!el) return;\n const { scrollLeft, scrollWidth, clientWidth } = el;\n setCanScrollLeft(scrollLeft > 1);\n setCanScrollRight(scrollLeft + clientWidth < scrollWidth - 1);\n }, []);\n\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n\n updateScrollState();\n\n el.addEventListener('scroll', updateScrollState, { passive: true });\n\n const observer = new ResizeObserver(updateScrollState);\n observer.observe(el);\n\n return () => {\n el.removeEventListener('scroll', updateScrollState);\n observer.disconnect();\n };\n }, [updateScrollState]);\n\n const prevColumnsRef = useRef(numOfColumns);\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n if (numOfColumns > prevColumnsRef.current) {\n // New column added — scroll to the right end so it's visible\n requestAnimationFrame(() => {\n el.scrollTo({ left: el.scrollWidth, behavior: 'smooth' });\n });\n }\n prevColumnsRef.current = numOfColumns;\n }, [numOfColumns]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n e.preventDefault();\n scrollToColumn(e.key === 'ArrowLeft' ? 'left' : 'right');\n }\n };\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, []);\n\n const scrollToColumn = (direction: 'left' | 'right') => {\n const el = scrollRef.current;\n if (!el) return;\n\n const columns = Array.from(el.children) as HTMLElement[];\n const containerLeft = el.scrollLeft;\n const containerRight = containerLeft + el.clientWidth;\n\n if (direction === 'right') {\n // Find the first column whose right edge is past the container's right edge\n const target = columns.find(col => col.offsetLeft + col.offsetWidth > containerRight + 1);\n if (target) {\n el.scrollTo({ left: target.offsetLeft + target.offsetWidth - el.clientWidth, behavior: 'smooth' });\n }\n } else {\n // Find the last column whose left edge is before the container's left edge\n const target = [...columns].reverse().find(col => col.offsetLeft < containerLeft - 1);\n if (target) {\n el.scrollTo({ left: target.offsetLeft, behavior: 'smooth' });\n }\n }\n };\n\n return (\n <div className={cn('MULTI_COLUMN relative w-full h-full overflow-hidden')}>\n {canScrollLeft && <ScrollArrow direction=\"left\" onClick={() => scrollToColumn('left')} />}\n {canScrollRight && <ScrollArrow direction=\"right\" onClick={() => scrollToColumn('right')} />}\n <div\n ref={scrollRef}\n className=\"grid overflow-x-auto w-full overflow-y-auto h-full\"\n style={{\n gridTemplateColumns: `repeat(${numOfColumns}, minmax(${minColumnWidth ?? '0'}, 1fr))`,\n }}\n >\n {children}\n </div>\n </div>\n );\n}\n\nfunction ScrollArrow({ direction, onClick }: { direction: 'left' | 'right'; onClick: () => void }) {\n const Icon = direction === 'left' ? ChevronLeftIcon : ChevronRightIcon;\n const isLeft = direction === 'left';\n\n return (\n <div\n className={cn(\n 'absolute top-0 bottom-0 z-20 w-20 flex items-center justify-center px-5 bg-surface2',\n isLeft ? 'left-0' : 'right-0',\n )}\n >\n <Button onClick={onClick} className=\"w-full h-full px-0\" aria-label={`Scroll ${direction}`}>\n <Icon />\n </Button>\n </div>\n );\n}\n"],"names":["cn","jsxs","jsx","useRef","useState","useCallback","useEffect","ChevronLeftIcon","ChevronRightIcon","Button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"multi-column-BLp7eL6P.cjs","sources":["../src/ds/components/Columns/column-content.tsx","../src/ds/components/Columns/column-root.tsx","../src/ds/components/Columns/column-toolbar.tsx","../src/ds/components/Columns/column.tsx","../src/ds/components/Columns/columns.tsx","../src/ds/components/Columns/multi-column.tsx"],"sourcesContent":["import { cn } from '@/index';\n\nexport type ColumnProps = {\n children?: React.ReactNode;\n className?: string;\n};\n\nexport function ColumnContent({ children, className }: ColumnProps) {\n return <div className={cn(`grid overflow-y-auto gap-8 content-start`, className)}>{children}</div>;\n}\n","import { cn } from '@/index';\n\nexport type ColumnProps = {\n children: React.ReactNode;\n className?: string;\n withRightSeparator?: boolean;\n withLeftSeparator?: boolean;\n};\n\nexport function ColumnRoot({ children, className, withLeftSeparator, withRightSeparator }: ColumnProps) {\n return (\n <div className=\"flex overflow-y-auto w-full\">\n {withLeftSeparator && <Separator />}\n\n <div className={cn(`grid gap-8 content-start w-full overflow-y-auto`, className)}>{children}</div>\n\n {withRightSeparator && <Separator />}\n </div>\n );\n}\n\nfunction Separator() {\n return <div className={cn('bg-surface5 w-[3px] shrink-0 mx-[1.5vw]')}></div>;\n}\n","import { cn } from '@/index';\n\nexport type ColumnToolbarProps = {\n children?: React.ReactNode;\n className?: string;\n};\n\nexport function ColumnToolbar({ children, className }: ColumnToolbarProps) {\n return (\n <div className={cn(`flex items-center justify-between w-full flex-wrap gap-4 gap-x-6`, className)}>{children}</div>\n );\n}\n","import { ColumnContent } from './column-content';\nimport { ColumnRoot } from './column-root';\nimport { ColumnToolbar } from './column-toolbar';\n\nexport const Column = Object.assign(ColumnRoot, {\n Content: ColumnContent,\n Toolbar: ColumnToolbar,\n});\n","import { cn } from '@/index';\n\nexport type ColumnsProps = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport function Columns({ children, className }: ColumnsProps) {\n return <div className={cn(`grid w-full h-full grid-cols-1 overflow-y-auto`, className)}>{children}</div>;\n}\n","'use client';\n\nimport { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { Button } from '../Button';\nimport { cn } from '@/lib/utils';\n\nexport type MultiColumnProps = {\n children?: React.ReactNode;\n numOfColumns?: number;\n minColumnWidth?: string;\n};\n\nexport function MultiColumn({ children, numOfColumns = 1, minColumnWidth }: MultiColumnProps): React.JSX.Element {\n const scrollRef = useRef<HTMLDivElement>(null);\n const [canScrollLeft, setCanScrollLeft] = useState(false);\n const [canScrollRight, setCanScrollRight] = useState(false);\n const updateScrollState = useCallback(() => {\n const el = scrollRef.current;\n if (!el) return;\n const { scrollLeft, scrollWidth, clientWidth } = el;\n setCanScrollLeft(scrollLeft > 1);\n setCanScrollRight(scrollLeft + clientWidth < scrollWidth - 1);\n }, []);\n\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n\n updateScrollState();\n\n el.addEventListener('scroll', updateScrollState, { passive: true });\n\n const observer = new ResizeObserver(updateScrollState);\n observer.observe(el);\n\n return () => {\n el.removeEventListener('scroll', updateScrollState);\n observer.disconnect();\n };\n }, [updateScrollState]);\n\n const prevColumnsRef = useRef(numOfColumns);\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n if (numOfColumns > prevColumnsRef.current) {\n // New column added — scroll to the right end so it's visible\n requestAnimationFrame(() => {\n el.scrollTo({ left: el.scrollWidth, behavior: 'smooth' });\n });\n }\n prevColumnsRef.current = numOfColumns;\n }, [numOfColumns]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n e.preventDefault();\n scrollToColumn(e.key === 'ArrowLeft' ? 'left' : 'right');\n }\n };\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, []);\n\n const scrollToColumn = (direction: 'left' | 'right') => {\n const el = scrollRef.current;\n if (!el) return;\n\n const columns = Array.from(el.children) as HTMLElement[];\n const containerLeft = el.scrollLeft;\n const containerRight = containerLeft + el.clientWidth;\n\n if (direction === 'right') {\n // Find the first column whose right edge is past the container's right edge\n const target = columns.find(col => col.offsetLeft + col.offsetWidth > containerRight + 1);\n if (target) {\n el.scrollTo({ left: target.offsetLeft + target.offsetWidth - el.clientWidth, behavior: 'smooth' });\n }\n } else {\n // Find the last column whose left edge is before the container's left edge\n const target = [...columns].reverse().find(col => col.offsetLeft < containerLeft - 1);\n if (target) {\n el.scrollTo({ left: target.offsetLeft, behavior: 'smooth' });\n }\n }\n };\n\n return (\n <div className={cn('MULTI_COLUMN relative w-full h-full overflow-hidden')}>\n {canScrollLeft && <ScrollArrow direction=\"left\" onClick={() => scrollToColumn('left')} />}\n {canScrollRight && <ScrollArrow direction=\"right\" onClick={() => scrollToColumn('right')} />}\n <div\n ref={scrollRef}\n className=\"grid overflow-x-auto w-full overflow-y-auto h-full\"\n style={{\n gridTemplateColumns: `repeat(${numOfColumns}, minmax(${minColumnWidth ?? '0'}, 1fr))`,\n }}\n >\n {children}\n </div>\n </div>\n );\n}\n\nfunction ScrollArrow({ direction, onClick }: { direction: 'left' | 'right'; onClick: () => void }) {\n const Icon = direction === 'left' ? ChevronLeftIcon : ChevronRightIcon;\n const isLeft = direction === 'left';\n\n return (\n <div\n className={cn(\n 'absolute top-0 bottom-0 z-20 w-20 flex items-center justify-center px-5 bg-surface2',\n isLeft ? 'left-0' : 'right-0',\n )}\n >\n <Button onClick={onClick} className=\"w-full h-full px-0\" aria-label={`Scroll ${direction}`}>\n <Icon />\n </Button>\n </div>\n );\n}\n"],"names":["cn","jsxs","jsx","useRef","useState","useCallback","useEffect","ChevronLeftIcon","ChevronRightIcon","Button"],"mappings":"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"}
|
|
@@ -3,7 +3,6 @@ import './index.css';/* empty css */
|
|
|
3
3
|
import '@base-ui/react/combobox';
|
|
4
4
|
import './components/DataDetailsPanel.es.js';
|
|
5
5
|
import { useRef, useState, useCallback, useEffect } from 'react';
|
|
6
|
-
import './toast-BKsfnapA.js';
|
|
7
6
|
import { c as cn } from './cn-BakJzhuv.js';
|
|
8
7
|
import { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';
|
|
9
8
|
import { B as Button } from './Button-DUxP65eY.js';
|
|
@@ -130,4 +129,4 @@ function ScrollArrow({ direction, onClick }) {
|
|
|
130
129
|
}
|
|
131
130
|
|
|
132
131
|
export { Column as C, MultiColumn as M, Columns as a };
|
|
133
|
-
//# sourceMappingURL=multi-column-
|
|
132
|
+
//# sourceMappingURL=multi-column-DeSb1YDE.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multi-column-p8sEagdM.js","sources":["../src/ds/components/Columns/column-content.tsx","../src/ds/components/Columns/column-root.tsx","../src/ds/components/Columns/column-toolbar.tsx","../src/ds/components/Columns/column.tsx","../src/ds/components/Columns/columns.tsx","../src/ds/components/Columns/multi-column.tsx"],"sourcesContent":["import { cn } from '@/index';\n\nexport type ColumnProps = {\n children?: React.ReactNode;\n className?: string;\n};\n\nexport function ColumnContent({ children, className }: ColumnProps) {\n return <div className={cn(`grid overflow-y-auto gap-8 content-start`, className)}>{children}</div>;\n}\n","import { cn } from '@/index';\n\nexport type ColumnProps = {\n children: React.ReactNode;\n className?: string;\n withRightSeparator?: boolean;\n withLeftSeparator?: boolean;\n};\n\nexport function ColumnRoot({ children, className, withLeftSeparator, withRightSeparator }: ColumnProps) {\n return (\n <div className=\"flex overflow-y-auto w-full\">\n {withLeftSeparator && <Separator />}\n\n <div className={cn(`grid gap-8 content-start w-full overflow-y-auto`, className)}>{children}</div>\n\n {withRightSeparator && <Separator />}\n </div>\n );\n}\n\nfunction Separator() {\n return <div className={cn('bg-surface5 w-[3px] shrink-0 mx-[1.5vw]')}></div>;\n}\n","import { cn } from '@/index';\n\nexport type ColumnToolbarProps = {\n children?: React.ReactNode;\n className?: string;\n};\n\nexport function ColumnToolbar({ children, className }: ColumnToolbarProps) {\n return (\n <div className={cn(`flex items-center justify-between w-full flex-wrap gap-4 gap-x-6`, className)}>{children}</div>\n );\n}\n","import { ColumnContent } from './column-content';\nimport { ColumnRoot } from './column-root';\nimport { ColumnToolbar } from './column-toolbar';\n\nexport const Column = Object.assign(ColumnRoot, {\n Content: ColumnContent,\n Toolbar: ColumnToolbar,\n});\n","import { cn } from '@/index';\n\nexport type ColumnsProps = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport function Columns({ children, className }: ColumnsProps) {\n return <div className={cn(`grid w-full h-full grid-cols-1 overflow-y-auto`, className)}>{children}</div>;\n}\n","'use client';\n\nimport { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { Button } from '../Button';\nimport { cn } from '@/lib/utils';\n\nexport type MultiColumnProps = {\n children?: React.ReactNode;\n numOfColumns?: number;\n minColumnWidth?: string;\n};\n\nexport function MultiColumn({ children, numOfColumns = 1, minColumnWidth }: MultiColumnProps): React.JSX.Element {\n const scrollRef = useRef<HTMLDivElement>(null);\n const [canScrollLeft, setCanScrollLeft] = useState(false);\n const [canScrollRight, setCanScrollRight] = useState(false);\n const updateScrollState = useCallback(() => {\n const el = scrollRef.current;\n if (!el) return;\n const { scrollLeft, scrollWidth, clientWidth } = el;\n setCanScrollLeft(scrollLeft > 1);\n setCanScrollRight(scrollLeft + clientWidth < scrollWidth - 1);\n }, []);\n\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n\n updateScrollState();\n\n el.addEventListener('scroll', updateScrollState, { passive: true });\n\n const observer = new ResizeObserver(updateScrollState);\n observer.observe(el);\n\n return () => {\n el.removeEventListener('scroll', updateScrollState);\n observer.disconnect();\n };\n }, [updateScrollState]);\n\n const prevColumnsRef = useRef(numOfColumns);\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n if (numOfColumns > prevColumnsRef.current) {\n // New column added — scroll to the right end so it's visible\n requestAnimationFrame(() => {\n el.scrollTo({ left: el.scrollWidth, behavior: 'smooth' });\n });\n }\n prevColumnsRef.current = numOfColumns;\n }, [numOfColumns]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n e.preventDefault();\n scrollToColumn(e.key === 'ArrowLeft' ? 'left' : 'right');\n }\n };\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, []);\n\n const scrollToColumn = (direction: 'left' | 'right') => {\n const el = scrollRef.current;\n if (!el) return;\n\n const columns = Array.from(el.children) as HTMLElement[];\n const containerLeft = el.scrollLeft;\n const containerRight = containerLeft + el.clientWidth;\n\n if (direction === 'right') {\n // Find the first column whose right edge is past the container's right edge\n const target = columns.find(col => col.offsetLeft + col.offsetWidth > containerRight + 1);\n if (target) {\n el.scrollTo({ left: target.offsetLeft + target.offsetWidth - el.clientWidth, behavior: 'smooth' });\n }\n } else {\n // Find the last column whose left edge is before the container's left edge\n const target = [...columns].reverse().find(col => col.offsetLeft < containerLeft - 1);\n if (target) {\n el.scrollTo({ left: target.offsetLeft, behavior: 'smooth' });\n }\n }\n };\n\n return (\n <div className={cn('MULTI_COLUMN relative w-full h-full overflow-hidden')}>\n {canScrollLeft && <ScrollArrow direction=\"left\" onClick={() => scrollToColumn('left')} />}\n {canScrollRight && <ScrollArrow direction=\"right\" onClick={() => scrollToColumn('right')} />}\n <div\n ref={scrollRef}\n className=\"grid overflow-x-auto w-full overflow-y-auto h-full\"\n style={{\n gridTemplateColumns: `repeat(${numOfColumns}, minmax(${minColumnWidth ?? '0'}, 1fr))`,\n }}\n >\n {children}\n </div>\n </div>\n );\n}\n\nfunction ScrollArrow({ direction, onClick }: { direction: 'left' | 'right'; onClick: () => void }) {\n const Icon = direction === 'left' ? ChevronLeftIcon : ChevronRightIcon;\n const isLeft = direction === 'left';\n\n return (\n <div\n className={cn(\n 'absolute top-0 bottom-0 z-20 w-20 flex items-center justify-center px-5 bg-surface2',\n isLeft ? 'left-0' : 'right-0',\n )}\n >\n <Button onClick={onClick} className=\"w-full h-full px-0\" aria-label={`Scroll ${direction}`}>\n <Icon />\n </Button>\n </div>\n );\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"multi-column-DeSb1YDE.js","sources":["../src/ds/components/Columns/column-content.tsx","../src/ds/components/Columns/column-root.tsx","../src/ds/components/Columns/column-toolbar.tsx","../src/ds/components/Columns/column.tsx","../src/ds/components/Columns/columns.tsx","../src/ds/components/Columns/multi-column.tsx"],"sourcesContent":["import { cn } from '@/index';\n\nexport type ColumnProps = {\n children?: React.ReactNode;\n className?: string;\n};\n\nexport function ColumnContent({ children, className }: ColumnProps) {\n return <div className={cn(`grid overflow-y-auto gap-8 content-start`, className)}>{children}</div>;\n}\n","import { cn } from '@/index';\n\nexport type ColumnProps = {\n children: React.ReactNode;\n className?: string;\n withRightSeparator?: boolean;\n withLeftSeparator?: boolean;\n};\n\nexport function ColumnRoot({ children, className, withLeftSeparator, withRightSeparator }: ColumnProps) {\n return (\n <div className=\"flex overflow-y-auto w-full\">\n {withLeftSeparator && <Separator />}\n\n <div className={cn(`grid gap-8 content-start w-full overflow-y-auto`, className)}>{children}</div>\n\n {withRightSeparator && <Separator />}\n </div>\n );\n}\n\nfunction Separator() {\n return <div className={cn('bg-surface5 w-[3px] shrink-0 mx-[1.5vw]')}></div>;\n}\n","import { cn } from '@/index';\n\nexport type ColumnToolbarProps = {\n children?: React.ReactNode;\n className?: string;\n};\n\nexport function ColumnToolbar({ children, className }: ColumnToolbarProps) {\n return (\n <div className={cn(`flex items-center justify-between w-full flex-wrap gap-4 gap-x-6`, className)}>{children}</div>\n );\n}\n","import { ColumnContent } from './column-content';\nimport { ColumnRoot } from './column-root';\nimport { ColumnToolbar } from './column-toolbar';\n\nexport const Column = Object.assign(ColumnRoot, {\n Content: ColumnContent,\n Toolbar: ColumnToolbar,\n});\n","import { cn } from '@/index';\n\nexport type ColumnsProps = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport function Columns({ children, className }: ColumnsProps) {\n return <div className={cn(`grid w-full h-full grid-cols-1 overflow-y-auto`, className)}>{children}</div>;\n}\n","'use client';\n\nimport { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { Button } from '../Button';\nimport { cn } from '@/lib/utils';\n\nexport type MultiColumnProps = {\n children?: React.ReactNode;\n numOfColumns?: number;\n minColumnWidth?: string;\n};\n\nexport function MultiColumn({ children, numOfColumns = 1, minColumnWidth }: MultiColumnProps): React.JSX.Element {\n const scrollRef = useRef<HTMLDivElement>(null);\n const [canScrollLeft, setCanScrollLeft] = useState(false);\n const [canScrollRight, setCanScrollRight] = useState(false);\n const updateScrollState = useCallback(() => {\n const el = scrollRef.current;\n if (!el) return;\n const { scrollLeft, scrollWidth, clientWidth } = el;\n setCanScrollLeft(scrollLeft > 1);\n setCanScrollRight(scrollLeft + clientWidth < scrollWidth - 1);\n }, []);\n\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n\n updateScrollState();\n\n el.addEventListener('scroll', updateScrollState, { passive: true });\n\n const observer = new ResizeObserver(updateScrollState);\n observer.observe(el);\n\n return () => {\n el.removeEventListener('scroll', updateScrollState);\n observer.disconnect();\n };\n }, [updateScrollState]);\n\n const prevColumnsRef = useRef(numOfColumns);\n useEffect(() => {\n const el = scrollRef.current;\n if (!el) return;\n if (numOfColumns > prevColumnsRef.current) {\n // New column added — scroll to the right end so it's visible\n requestAnimationFrame(() => {\n el.scrollTo({ left: el.scrollWidth, behavior: 'smooth' });\n });\n }\n prevColumnsRef.current = numOfColumns;\n }, [numOfColumns]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n e.preventDefault();\n scrollToColumn(e.key === 'ArrowLeft' ? 'left' : 'right');\n }\n };\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, []);\n\n const scrollToColumn = (direction: 'left' | 'right') => {\n const el = scrollRef.current;\n if (!el) return;\n\n const columns = Array.from(el.children) as HTMLElement[];\n const containerLeft = el.scrollLeft;\n const containerRight = containerLeft + el.clientWidth;\n\n if (direction === 'right') {\n // Find the first column whose right edge is past the container's right edge\n const target = columns.find(col => col.offsetLeft + col.offsetWidth > containerRight + 1);\n if (target) {\n el.scrollTo({ left: target.offsetLeft + target.offsetWidth - el.clientWidth, behavior: 'smooth' });\n }\n } else {\n // Find the last column whose left edge is before the container's left edge\n const target = [...columns].reverse().find(col => col.offsetLeft < containerLeft - 1);\n if (target) {\n el.scrollTo({ left: target.offsetLeft, behavior: 'smooth' });\n }\n }\n };\n\n return (\n <div className={cn('MULTI_COLUMN relative w-full h-full overflow-hidden')}>\n {canScrollLeft && <ScrollArrow direction=\"left\" onClick={() => scrollToColumn('left')} />}\n {canScrollRight && <ScrollArrow direction=\"right\" onClick={() => scrollToColumn('right')} />}\n <div\n ref={scrollRef}\n className=\"grid overflow-x-auto w-full overflow-y-auto h-full\"\n style={{\n gridTemplateColumns: `repeat(${numOfColumns}, minmax(${minColumnWidth ?? '0'}, 1fr))`,\n }}\n >\n {children}\n </div>\n </div>\n );\n}\n\nfunction ScrollArrow({ direction, onClick }: { direction: 'left' | 'right'; onClick: () => void }) {\n const Icon = direction === 'left' ? ChevronLeftIcon : ChevronRightIcon;\n const isLeft = direction === 'left';\n\n return (\n <div\n className={cn(\n 'absolute top-0 bottom-0 z-20 w-20 flex items-center justify-center px-5 bg-surface2',\n isLeft ? 'left-0' : 'right-0',\n )}\n >\n <Button onClick={onClick} className=\"w-full h-full px-0\" aria-label={`Scroll ${direction}`}>\n <Icon />\n </Button>\n </div>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;AAOO,SAAS,aAAA,CAAc,EAAE,QAAA,EAAU,SAAA,EAAU,EAAgB;AAClE,EAAA,2BAAQ,KAAA,EAAA,EAAI,SAAA,EAAW,GAAG,CAAA,wCAAA,CAAA,EAA4C,SAAS,GAAI,QAAA,EAAS,CAAA;AAC9F;;ACAO,SAAS,WAAW,EAAE,QAAA,EAAU,SAAA,EAAW,iBAAA,EAAmB,oBAAmB,EAAgB;AACtG,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,6BAAA,EACZ,QAAA,EAAA;AAAA,IAAA,iBAAA,wBAAsB,SAAA,EAAA,EAAU,CAAA;AAAA,wBAEhC,KAAA,EAAA,EAAI,SAAA,EAAW,GAAG,CAAA,+CAAA,CAAA,EAAmD,SAAS,GAAI,QAAA,EAAS,CAAA;AAAA,IAE3F,kBAAA,wBAAuB,SAAA,EAAA,EAAU;AAAA,GAAA,EACpC,CAAA;AAEJ;AAEA,SAAS,SAAA,GAAY;AACnB,EAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,yCAAyC,CAAA,EAAG,CAAA;AACxE;;AChBO,SAAS,aAAA,CAAc,EAAE,QAAA,EAAU,SAAA,EAAU,EAAuB;AACzE,EAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAW,GAAG,CAAA,gEAAA,CAAA,EAAoE,SAAS,GAAI,QAAA,EAAS,CAAA;AAEjH;;ACPO,MAAM,MAAA,GAAS,MAAA,CAAO,MAAA,CAAO,UAAA,EAAY;AAAA,EAC9C,OAAA,EAAS,aAAA;AAAA,EACT,OAAA,EAAS;AACX,CAAC;;ACAM,SAAS,OAAA,CAAQ,EAAE,QAAA,EAAU,SAAA,EAAU,EAAiB;AAC7D,EAAA,2BAAQ,KAAA,EAAA,EAAI,SAAA,EAAW,GAAG,CAAA,8CAAA,CAAA,EAAkD,SAAS,GAAI,QAAA,EAAS,CAAA;AACpG;;ACIO,SAAS,YAAY,EAAE,QAAA,EAAU,YAAA,GAAe,CAAA,EAAG,gBAAe,EAAwC;AAC/G,EAAA,MAAM,SAAA,GAAY,OAAuB,IAAI,CAAA;AAC7C,EAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAI,SAAS,KAAK,CAAA;AACxD,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,SAAS,KAAK,CAAA;AAC1D,EAAA,MAAM,iBAAA,GAAoB,YAAY,MAAM;AAC1C,IAAA,MAAM,KAAK,SAAA,CAAU,OAAA;AACrB,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,MAAM,EAAE,UAAA,EAAY,WAAA,EAAa,WAAA,EAAY,GAAI,EAAA;AACjD,IAAA,gBAAA,CAAiB,aAAa,CAAC,CAAA;AAC/B,IAAA,iBAAA,CAAkB,UAAA,GAAa,WAAA,GAAc,WAAA,GAAc,CAAC,CAAA;AAAA,EAC9D,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,KAAK,SAAA,CAAU,OAAA;AACrB,IAAA,IAAI,CAAC,EAAA,EAAI;AAET,IAAA,iBAAA,EAAkB;AAElB,IAAA,EAAA,CAAG,iBAAiB,QAAA,EAAU,iBAAA,EAAmB,EAAE,OAAA,EAAS,MAAM,CAAA;AAElE,IAAA,MAAM,QAAA,GAAW,IAAI,cAAA,CAAe,iBAAiB,CAAA;AACrD,IAAA,QAAA,CAAS,QAAQ,EAAE,CAAA;AAEnB,IAAA,OAAO,MAAM;AACX,MAAA,EAAA,CAAG,mBAAA,CAAoB,UAAU,iBAAiB,CAAA;AAClD,MAAA,QAAA,CAAS,UAAA,EAAW;AAAA,IACtB,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,iBAAiB,CAAC,CAAA;AAEtB,EAAA,MAAM,cAAA,GAAiB,OAAO,YAAY,CAAA;AAC1C,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,KAAK,SAAA,CAAU,OAAA;AACrB,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,IAAI,YAAA,GAAe,eAAe,OAAA,EAAS;AAEzC,MAAA,qBAAA,CAAsB,MAAM;AAC1B,QAAA,EAAA,CAAG,SAAS,EAAE,IAAA,EAAM,GAAG,WAAA,EAAa,QAAA,EAAU,UAAU,CAAA;AAAA,MAC1D,CAAC,CAAA;AAAA,IACH;AACA,IAAA,cAAA,CAAe,OAAA,GAAU,YAAA;AAAA,EAC3B,CAAA,EAAG,CAAC,YAAY,CAAC,CAAA;AAEjB,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,aAAA,GAAgB,CAAC,CAAA,KAAqB;AAC1C,MAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,WAAA,IAAe,CAAA,CAAE,QAAQ,YAAA,EAAc;AACnD,QAAA,CAAA,CAAE,cAAA,EAAe;AACjB,QAAA,cAAA,CAAe,CAAA,CAAE,GAAA,KAAQ,WAAA,GAAc,MAAA,GAAS,OAAO,CAAA;AAAA,MACzD;AAAA,IACF,CAAA;AACA,IAAA,MAAA,CAAO,gBAAA,CAAiB,WAAW,aAAa,CAAA;AAChD,IAAA,OAAO,MAAM,MAAA,CAAO,mBAAA,CAAoB,SAAA,EAAW,aAAa,CAAA;AAAA,EAClE,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,cAAA,GAAiB,CAAC,SAAA,KAAgC;AACtD,IAAA,MAAM,KAAK,SAAA,CAAU,OAAA;AACrB,IAAA,IAAI,CAAC,EAAA,EAAI;AAET,IAAA,MAAM,OAAA,GAAU,KAAA,CAAM,IAAA,CAAK,EAAA,CAAG,QAAQ,CAAA;AACtC,IAAA,MAAM,gBAAgB,EAAA,CAAG,UAAA;AACzB,IAAA,MAAM,cAAA,GAAiB,gBAAgB,EAAA,CAAG,WAAA;AAE1C,IAAA,IAAI,cAAc,OAAA,EAAS;AAEzB,MAAA,MAAM,MAAA,GAAS,QAAQ,IAAA,CAAK,CAAA,GAAA,KAAO,IAAI,UAAA,GAAa,GAAA,CAAI,WAAA,GAAc,cAAA,GAAiB,CAAC,CAAA;AACxF,MAAA,IAAI,MAAA,EAAQ;AACV,QAAA,EAAA,CAAG,QAAA,CAAS,EAAE,IAAA,EAAM,MAAA,CAAO,UAAA,GAAa,MAAA,CAAO,WAAA,GAAc,EAAA,CAAG,WAAA,EAAa,QAAA,EAAU,QAAA,EAAU,CAAA;AAAA,MACnG;AAAA,IACF,CAAA,MAAO;AAEL,MAAA,MAAM,MAAA,GAAS,CAAC,GAAG,OAAO,CAAA,CAAE,OAAA,EAAQ,CAAE,IAAA,CAAK,CAAA,GAAA,KAAO,GAAA,CAAI,UAAA,GAAa,aAAA,GAAgB,CAAC,CAAA;AACpF,MAAA,IAAI,MAAA,EAAQ;AACV,QAAA,EAAA,CAAG,SAAS,EAAE,IAAA,EAAM,OAAO,UAAA,EAAY,QAAA,EAAU,UAAU,CAAA;AAAA,MAC7D;AAAA,IACF;AAAA,EACF,CAAA;AAEA,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,qDAAqD,CAAA,EACrE,QAAA,EAAA;AAAA,IAAA,aAAA,oBAAiB,GAAA,CAAC,eAAY,SAAA,EAAU,MAAA,EAAO,SAAS,MAAM,cAAA,CAAe,MAAM,CAAA,EAAG,CAAA;AAAA,IACtF,cAAA,wBAAmB,WAAA,EAAA,EAAY,SAAA,EAAU,SAAQ,OAAA,EAAS,MAAM,cAAA,CAAe,OAAO,CAAA,EAAG,CAAA;AAAA,oBAC1F,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,SAAA;AAAA,QACL,SAAA,EAAU,oDAAA;AAAA,QACV,KAAA,EAAO;AAAA,UACL,mBAAA,EAAqB,CAAA,OAAA,EAAU,YAAY,CAAA,SAAA,EAAY,kBAAkB,GAAG,CAAA,OAAA;AAAA,SAC9E;AAAA,QAEC;AAAA;AAAA;AACH,GAAA,EACF,CAAA;AAEJ;AAEA,SAAS,WAAA,CAAY,EAAE,SAAA,EAAW,OAAA,EAAQ,EAAyD;AACjG,EAAA,MAAM,IAAA,GAAO,SAAA,KAAc,MAAA,GAAS,eAAA,GAAkB,gBAAA;AACtD,EAAA,MAAM,SAAS,SAAA,KAAc,MAAA;AAE7B,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,qFAAA;AAAA,QACA,SAAS,QAAA,GAAW;AAAA,OACtB;AAAA,MAEA,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,OAAA,EAAkB,SAAA,EAAU,oBAAA,EAAqB,YAAA,EAAY,CAAA,OAAA,EAAU,SAAS,CAAA,CAAA,EACtF,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,CAAA,EACR;AAAA;AAAA,GACF;AAEJ;;;;"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mastra/playground-ui",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "37.0.1-alpha.
|
|
4
|
+
"version": "37.0.1-alpha.1",
|
|
5
5
|
"description": "Mastra Playground components",
|
|
6
6
|
"main": "dist/index.umd.js",
|
|
7
7
|
"module": "dist/index.es.js",
|
|
@@ -119,8 +119,8 @@
|
|
|
119
119
|
"react": ">=19.0.0",
|
|
120
120
|
"react-dom": ">=19.0.0",
|
|
121
121
|
"tailwindcss": "^4.0.0",
|
|
122
|
-
"@mastra/client-js": "^1.28.1-alpha.
|
|
123
|
-
"@mastra/react": "1.2.1-alpha.
|
|
122
|
+
"@mastra/client-js": "^1.28.1-alpha.1",
|
|
123
|
+
"@mastra/react": "1.2.1-alpha.1"
|
|
124
124
|
},
|
|
125
125
|
"devDependencies": {
|
|
126
126
|
"@storybook/addon-a11y": "^10.4.1",
|
|
@@ -157,11 +157,11 @@
|
|
|
157
157
|
"vite-plugin-dts": "^4.5.4",
|
|
158
158
|
"vite-plugin-lib-inject-css": "^2.2.2",
|
|
159
159
|
"vitest": "4.1.8",
|
|
160
|
+
"@mastra/client-js": "^1.28.1-alpha.1",
|
|
160
161
|
"@internal/lint": "0.0.109",
|
|
161
|
-
"@mastra/client-js": "^1.28.1-alpha.0",
|
|
162
|
-
"@mastra/core": "1.48.0-alpha.0",
|
|
163
162
|
"@mastra/memory": "1.21.2",
|
|
164
|
-
"@mastra/react": "1.2.1-alpha.
|
|
163
|
+
"@mastra/react": "1.2.1-alpha.1",
|
|
164
|
+
"@mastra/core": "1.48.0-alpha.1"
|
|
165
165
|
},
|
|
166
166
|
"homepage": "https://mastra.ai",
|
|
167
167
|
"repository": {
|