mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-21 23:34:31 +00:00
04158deb02
## Summary Add Rename and Delete options for Personal Models. Also updates and standardizes some styles for Cards and adds a simple Confirmation dialog. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6969-WIP-Feat-Rename-and-Delete-for-custom-Models-2b86d73d36508140a687e929b0544ae6) by [Unito](https://www.unito.io) --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
import type { CSSProperties } from 'vue'
|
|
|
|
interface GridOptions {
|
|
/** Minimum width for each grid item (default: 15rem) */
|
|
minWidth?: string
|
|
/** Maximum width for each grid item (default: 1fr) */
|
|
maxWidth?: string
|
|
/** Padding around the grid (default: 0) */
|
|
padding?: string
|
|
/** Gap between grid items (default: 1rem) */
|
|
gap?: string
|
|
/** Fixed number of columns (overrides auto-fill with minmax) */
|
|
columns?: number
|
|
}
|
|
|
|
/**
|
|
* @deprecated Just use tailwind utilities directly.
|
|
* TODO: Create a common grid layout component if needed.
|
|
* Creates CSS grid styles for responsive grid layouts
|
|
* @param options Grid configuration options
|
|
* @returns CSS properties object for grid styling
|
|
*/
|
|
export function createGridStyle(options: GridOptions = {}): CSSProperties {
|
|
const {
|
|
minWidth = '15rem',
|
|
maxWidth = '1fr',
|
|
padding = '0',
|
|
gap = '1rem',
|
|
columns
|
|
} = options
|
|
|
|
// Runtime validation for columns
|
|
if (columns !== undefined && columns < 1) {
|
|
console.warn('createGridStyle: columns must be >= 1, defaulting to 1')
|
|
}
|
|
|
|
const gridTemplateColumns = columns
|
|
? `repeat(${Math.max(1, columns ?? 1)}, 1fr)`
|
|
: `repeat(auto-fill, minmax(${minWidth}, ${maxWidth}))`
|
|
|
|
return {
|
|
display: 'grid',
|
|
gridTemplateColumns,
|
|
padding,
|
|
gap
|
|
}
|
|
}
|