@postxl/generators 1.1.1 → 1.2.0

package/dist/frontend-core/template/src/components/ui/content-frame/content-frame.stories.tsx

@@ -1,198 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite'
-import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons'
-import { cn } from '@lib/utils'
-
-import { Button } from '@components/ui/button/button'
-
-import { ContentFrame } from './content-frame'
-import { expect, userEvent, screen } from 'storybook/test'
-import { useState } from 'react'
-import { Modal } from '@components/ui/modal/modal'
-import { Badge } from '@components/ui/badge/badge'
-
-const meta = {
-  title: 'ContentFrame',
-  component: ContentFrame,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  argTypes: {
-    title: {
-      control: 'text',
-    },
-    variant: {
-      control: 'select',
-      options: ['default', 'inverted'],
-    },
-  },
-} satisfies Meta<typeof ContentFrame>
-export default meta
-
-type Story = StoryObj<typeof meta>
-
-export const Default: Story = {
-  args: {
-    title: 'Title',
-    variant: 'default',
-  },
-  render: (args) => (
-    <div className="w-[350px]">
-      <ContentFrame {...args}>
-        <div className="p-2">Content inside the frame</div>
-      </ContentFrame>
-    </div>
-  ),
-  play: async () => {
-    expect(screen.getByText('Title')).toBeVisible()
-    expect(screen.getByText('Content inside the frame')).toBeVisible()
-    const frame = screen.getByText('Content inside the frame').closest('div')
-  },
-}
-
-export const Variants: Story = {
-  args: { title: '' },
-  render: () => (
-    <div className="flex gap-2">
-      <div className="w-[200px]">
-        <ContentFrame title="default" variant="default">
-          <div className="p-2">Content</div>
-        </ContentFrame>
-      </div>
-      <div className="w-[200px]">
-        <ContentFrame title="inverted" variant="inverted">
-          <div className="p-2">Content</div>
-        </ContentFrame>
-      </div>
-    </div>
-  ),
-}
-
-export const WithTitleLink: Story = {
-  args: {
-    title: '',
-    titleLink: (
-      <a href="https://example.com/" target="_blank" rel="noopener noreferrer">
-        <h2 className="text-xl overflow-hidden text-ellipsis whitespace-nowrap">Title with Link</h2>
-      </a>
-    ),
-  },
-  render: (args) => (
-    <div className="w-[350px]">
-      <ContentFrame {...args}>
-        <div className="p-2">Content inside the frame</div>
-      </ContentFrame>
-    </div>
-  ),
-  play: async () => {
-    // Check that the title link exists and is correct
-    const link = screen.getByRole('link', { name: /title with link/i })
-    expect(link).toHaveAttribute('href', 'https://example.com/')
-  },
-}
-
-export const CollapsibleAndExpandable: Story = {
-  args: { title: '' },
-  render: () => {
-    const dummyText =
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam rutrum laoreet erat ac sodales. Pellentesque nec nunc in ipsum tincidunt congue sit amet in augue. Sed interdum consequat arcu, ac tempor nisl eleifend sed. Mauris gravida ipsum orci, sed vestibulum nisl commodo in. Aliquam ut dolor dui. Donec fermentum viverra faucibus. In aliquet erat et quam ornare, et accumsan magna ornare. Suspendisse potenti. Etiam a elit dui. Mauris et lectus vel metus lobortis luctus. Vestibulum elementum sit amet augue vel rutrum. Aenean sem turpis, viverra hendrerit consequat eget, vulputate sed nunc. Pellentesque sollicitudin diam nunc, vel pretium massa mattis at. Curabitur fringilla convallis mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam rutrum laoreet erat ac sodales. Pellentesque nec nunc in ipsum tincidunt congue sit amet in augue. Sed interdum consequat arcu, ac tempor nisl eleifend sed. Mauris gravida ipsum orci, sed vestibulum nisl commodo in. Aliquam ut dolor dui. Donec fermentum viverra faucibus. In aliquet erat et quam ornare, et accumsan magna ornare. Suspendisse potenti. Etiam a elit dui. Mauris et lectus vel metus lobortis luctus. Vestibulum elementum sit amet augue vel rutrum. Aenean sem turpis, viverra hendrerit consequat eget, vulputate sed nunc. Pellentesque sollicitudin diam nunc, vel pretium massa mattis at. Curabitur fringilla convallis mollis. '
-
-    const [isCollapsed, setIsCollapsed] = useState(false)
-    const [isExpanded, setIsExpanded] = useState(false)
-    return (
-      <>
-        <div className="w-[350px]">
-          <div
-            className={cn(
-              'relative h-[250px]',
-              isCollapsed ? 'min-w-[60px] max-w-[60px]' : 'min-w-[350px] max-w-[350px]',
-            )}
-          >
-            <ContentFrame
-              title="Collapsible and Expandable"
-              variant="inverted"
-              collapsed={isCollapsed}
-              onExpand={() => setIsExpanded(true)}
-            >
-              <div className="p-2">{dummyText}</div>
-            </ContentFrame>
-            <Button
-              title={isCollapsed ? 'Show normal' : 'Collapse'}
-              variant="neutral"
-              size="iconSm"
-              className="absolute top-1/2 right-0 transform -translate-y-1/2 translate-x-1/4 z-10 rounded-full bg-muted-foreground text-background"
-              onClick={() => setIsCollapsed(!isCollapsed)}
-            >
-              {isCollapsed ? <ChevronRightIcon /> : <ChevronLeftIcon />}
-            </Button>
-          </div>
-        </div>
-        <Modal isOpen={isExpanded} setIsOpen={setIsExpanded} title="Collapsible and Expandable">
-          <div className="p-2">{dummyText}</div>
-        </Modal>
-      </>
-    )
-  },
-  play: async () => {
-    // Collapse the frame
-    const collapseBtn = screen.getByRole('button', { name: /collapse/i })
-    await userEvent.click(collapseBtn)
-    // After collapse, check that the ChevronRightIcon is rendered (collapsed state)
-    expect(screen.getByRole('button', { name: /show normal/i })).toBeVisible()
-    const expandModal = screen.getByText('Collapsible and Expandable')
-    expect(expandModal).toBeVisible()
-  },
-}
-
-export const WithControlsAndIndicators: Story = {
-  args: {
-    title: '',
-  },
-  render: (args) => {
-    const [newsUnread, setNewsUnread] = useState(true)
-    return (
-      <div className="w-[350px]">
-        <ContentFrame
-          {...args}
-          title={newsUnread ? 'Unread News' : 'No unread News'}
-          controls={[
-            <Button key="c1" variant="outline" size="sm" onClick={() => setNewsUnread(!newsUnread)}>
-              {newsUnread ? 'Read all' : 'Unread all'}
-            </Button>,
-          ]}
-          indicators={
-            newsUnread
-              ? [
-                  <Badge
-                    data-testid="pill-label"
-                    key="i1"
-                    className="self-center bg-(--ring) rounded-full h-5 text-background font-bold px-2"
-                  >
-                    3
-                  </Badge>,
-                ]
-              : []
-          }
-        >
-          <div className="p-2">
-            {newsUnread ? (
-              <>
-                News 1<br />
-                News 2<br />
-                News 3
-              </>
-            ) : (
-              'No new content'
-            )}
-          </div>
-        </ContentFrame>
-      </div>
-    )
-  },
-  play: async () => {
-    // Check for control button
-    expect(screen.getByRole('button', { name: /read all|unread all/i })).toBeVisible()
-    // Check for indicator badge
-    expect(screen.getByTestId('pill-label')).toBeVisible()
-  },
-}

package/dist/frontend-core/template/src/components/ui/content-frame/content-frame.tsx

@@ -1,100 +0,0 @@
-import { EnterFullScreenIcon } from '@radix-ui/react-icons'
-
-import { cva, type VariantProps } from 'class-variance-authority'
-import { type PropsWithChildren, type ReactNode } from 'react'
-
-import { Button } from '@components/ui/button/button'
-import { Loader } from '@components/ui/loader/loader'
-import { cn } from '@lib/utils'
-
-const gridContentFrameVariants = cva('flex flex-col border-1 border-(--discreet-border) h-full w-full', {
-  variants: {
-    variant: {
-      default: '',
-      inverted: 'bg-sidebar-border border-background border-e-transparent border-t-0',
-    },
-  },
-  defaultVariants: {
-    variant: 'default',
-  },
-})
-
-const gridContentFrameHeaderVariants = cva('flex items-center overflow-hidden p-3 min-h-10 border-b-1', {
-  variants: {
-    variant: {
-      default: 'border-(--discreet-border)',
-      inverted: 'border-t-0 border-t-sidebar-border border-b-background',
-    },
-  },
-  defaultVariants: {
-    variant: 'default',
-  },
-})
-
-type Props = PropsWithChildren<{
-  title: string
-  controls?: ReactNode[]
-  indicators?: ReactNode[]
-  onExpand?: () => void
-  collapsed?: boolean
-  titleLink?: ReactNode
-  isLoading?: boolean
-}> &
-  VariantProps<typeof gridContentFrameVariants>
-
-export const ContentFrame = ({
-  title = '',
-  controls = [],
-  indicators = [],
-  children,
-  onExpand,
-  variant,
-  collapsed,
-  titleLink,
-  isLoading = false,
-}: Props) => {
-  return (
-    <div className={cn(gridContentFrameVariants({ variant }))}>
-      {collapsed ? (
-        <div className="flex gap-2.5 min-w-0 items-center [writing-mode:vertical-lr]">
-          <h2 className="text-xl flex self-center ms-4">{title}</h2>
-          {indicators.length > 0 && <div className="flex gap-2 whitespace-nowrap">{indicators}</div>}
-        </div>
-      ) : (
-        <>
-          {/* header */}
-          <div className={cn(gridContentFrameHeaderVariants({ variant }))}>
-            {/* Title + Indicators */}
-            <div className="flex flex-grow gap-2 overflow-hidden">
-              <h2 className="text-xl overflow-hidden text-ellipsis whitespace-nowrap">{titleLink ?? title}</h2>
-              {indicators.length > 0 && <div className="flex gap-2 whitespace-nowrap">{indicators}</div>}
-            </div>
-
-            {/* Controls */}
-            {controls.length > 0 && <div className="flex gap-2 whitespace-nowrap">{controls}</div>}
-
-            {/* Expand button */}
-            {onExpand && (
-              <Button
-                title="Expand"
-                onClick={onExpand}
-                variant="outline"
-                size="icon"
-                className="size-6 ml-2"
-                __e2e_test_id__={`${title.toLowerCase().replaceAll(' ', '-')}-modal-button`}
-              >
-                <EnterFullScreenIcon />
-              </Button>
-            )}
-          </div>
-
-          {/* content */}
-          <div className="h-full min-h-0 overflow-auto relative">
-            {children}
-            {isLoading && <Loader label="Loading..." />}
-          </div>
-        </>
-      )}
-    </div>
-  )
-}

package/dist/frontend-core/template/src/components/ui/context-menu/context-menu.stories.tsx

@@ -1,78 +0,0 @@
-import { Meta } from '@storybook/react-vite'
-
-import {
-  ContextMenu,
-  ContextMenuCheckboxItem,
-  ContextMenuContent,
-  ContextMenuItem,
-  ContextMenuLabel,
-  ContextMenuRadioGroup,
-  ContextMenuRadioItem,
-  ContextMenuSeparator,
-  ContextMenuShortcut,
-  ContextMenuSub,
-  ContextMenuSubContent,
-  ContextMenuSubTrigger,
-  ContextMenuTrigger,
-} from './context-menu'
-import type { StoryObj } from '@storybook/react-vite'
-
-const meta: Meta<typeof ContextMenu> = {
-  title: 'Context Menu',
-  component: ContextMenu,
-  tags: ['autodocs'],
-} satisfies Meta<typeof ContextMenu>
-
-export default meta
-
-export const Default: StoryObj<typeof meta> = {
-  render: () => (
-    <div className="flex items-center justify-center">
-      <ContextMenu>
-        <ContextMenuTrigger className="flex h-[150px] w-[300px] items-center justify-center rounded-md border border-dashed text-sm">
-          Right click here
-        </ContextMenuTrigger>
-        <ContextMenuContent className="w-64">
-          <ContextMenuItem inset>
-            Back
-            <ContextMenuShortcut>⌘[</ContextMenuShortcut>
-          </ContextMenuItem>
-          <ContextMenuItem inset disabled>
-            Forward
-            <ContextMenuShortcut>⌘]</ContextMenuShortcut>
-          </ContextMenuItem>
-          <ContextMenuItem inset>
-            Reload
-            <ContextMenuShortcut>⌘R</ContextMenuShortcut>
-          </ContextMenuItem>
-          <ContextMenuSub>
-            <ContextMenuSubTrigger inset>More Tools</ContextMenuSubTrigger>
-            <ContextMenuSubContent className="w-48">
-              <ContextMenuItem>
-                Save Page As...
-                <ContextMenuShortcut>⇧⌘S</ContextMenuShortcut>
-              </ContextMenuItem>
-              <ContextMenuItem>Create Shortcut...</ContextMenuItem>
-              <ContextMenuItem>Name Window...</ContextMenuItem>
-              <ContextMenuSeparator />
-              <ContextMenuItem>Developer Tools</ContextMenuItem>
-            </ContextMenuSubContent>
-          </ContextMenuSub>
-          <ContextMenuSeparator />
-          <ContextMenuCheckboxItem checked>
-            Show Bookmarks Bar
-            <ContextMenuShortcut>⌘⇧B</ContextMenuShortcut>
-          </ContextMenuCheckboxItem>
-          <ContextMenuCheckboxItem>Show Full URLs</ContextMenuCheckboxItem>
-          <ContextMenuSeparator />
-          <ContextMenuRadioGroup value="pedro">
-            <ContextMenuLabel inset>People</ContextMenuLabel>
-            <ContextMenuSeparator />
-            <ContextMenuRadioItem value="pedro">Pedro Duarte</ContextMenuRadioItem>
-            <ContextMenuRadioItem value="colm">Colm Tuite</ContextMenuRadioItem>
-          </ContextMenuRadioGroup>
-        </ContextMenuContent>
-      </ContextMenu>
-    </div>
-  ),
-}

package/dist/frontend-core/template/src/components/ui/context-menu/context-menu.tsx

@@ -1,179 +0,0 @@
-import * as ContextMenuPrimitive from '@radix-ui/react-context-menu'
-import { CheckIcon, ChevronRightIcon, DotFilledIcon } from '@radix-ui/react-icons'
-
-import * as React from 'react'
-
-import { cn } from '@lib/utils'
-
-const ContextMenu = ContextMenuPrimitive.Root
-
-const ContextMenuTrigger = ContextMenuPrimitive.Trigger
-
-const ContextMenuGroup = ContextMenuPrimitive.Group
-
-const ContextMenuPortal = ContextMenuPrimitive.Portal
-
-const ContextMenuSub = ContextMenuPrimitive.Sub
-
-const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup
-
-const ContextMenuSubTrigger = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.SubTrigger>,
-  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubTrigger> & {
-    inset?: boolean
-  }
->(({ className, inset, children, ...props }, ref) => (
-  <ContextMenuPrimitive.SubTrigger
-    ref={ref}
-    className={cn(
-      'flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground',
-      inset && 'pl-8',
-      className,
-    )}
-    {...props}
-  >
-    {children}
-    <ChevronRightIcon className="ml-auto h-4 w-4" />
-  </ContextMenuPrimitive.SubTrigger>
-))
-ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName
-
-const ContextMenuSubContent = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.SubContent>,
-  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubContent>
->(({ className, ...props }, ref) => (
-  <ContextMenuPrimitive.SubContent
-    ref={ref}
-    className={cn(
-      'z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-      className,
-    )}
-    {...props}
-  />
-))
-ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName
-
-const ContextMenuContent = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Content>
->(({ className, ...props }, ref) => (
-  <ContextMenuPrimitive.Portal>
-    <ContextMenuPrimitive.Content
-      ref={ref}
-      className={cn(
-        'z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-        className,
-      )}
-      {...props}
-    />
-  </ContextMenuPrimitive.Portal>
-))
-ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName
-
-const ContextMenuItem = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.Item>,
-  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Item> & {
-    inset?: boolean
-  }
->(({ className, inset, ...props }, ref) => (
-  <ContextMenuPrimitive.Item
-    ref={ref}
-    className={cn(
-      'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
-      inset && 'pl-8',
-      className,
-    )}
-    {...props}
-  />
-))
-ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName
-
-const ContextMenuCheckboxItem = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.CheckboxItem>,
-  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.CheckboxItem>
->(({ className, children, checked, ...props }, ref) => (
-  <ContextMenuPrimitive.CheckboxItem
-    ref={ref}
-    className={cn(
-      'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
-      className,
-    )}
-    checked={checked}
-    {...props}
-  >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
-      <ContextMenuPrimitive.ItemIndicator>
-        <CheckIcon className="h-4 w-4" />
-      </ContextMenuPrimitive.ItemIndicator>
-    </span>
-    {children}
-  </ContextMenuPrimitive.CheckboxItem>
-))
-ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName
-
-const ContextMenuRadioItem = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.RadioItem>,
-  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.RadioItem>
->(({ className, children, ...props }, ref) => (
-  <ContextMenuPrimitive.RadioItem
-    ref={ref}
-    className={cn(
-      'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
-      className,
-    )}
-    {...props}
-  >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
-      <ContextMenuPrimitive.ItemIndicator>
-        <DotFilledIcon className="h-4 w-4 fill-current" />
-      </ContextMenuPrimitive.ItemIndicator>
-    </span>
-    {children}
-  </ContextMenuPrimitive.RadioItem>
-))
-ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName
-
-const ContextMenuLabel = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.Label>,
-  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Label> & {
-    inset?: boolean
-  }
->(({ className, inset, ...props }, ref) => (
-  <ContextMenuPrimitive.Label
-    ref={ref}
-    className={cn('px-2 py-1.5 text-sm font-semibold text-foreground', inset && 'pl-8', className)}
-    {...props}
-  />
-))
-ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName
-
-const ContextMenuSeparator = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.Separator>,
-  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Separator>
->(({ className, ...props }, ref) => (
-  <ContextMenuPrimitive.Separator ref={ref} className={cn('-mx-1 my-1 h-px bg-border', className)} {...props} />
-))
-ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName
-
-const ContextMenuShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {
-  return <span className={cn('ml-auto text-xs tracking-widest text-muted-foreground', className)} {...props} />
-}
-ContextMenuShortcut.displayName = 'ContextMenuShortcut'
-
-export {
-  ContextMenu,
-  ContextMenuTrigger,
-  ContextMenuContent,
-  ContextMenuItem,
-  ContextMenuCheckboxItem,
-  ContextMenuRadioItem,
-  ContextMenuLabel,
-  ContextMenuSeparator,
-  ContextMenuShortcut,
-  ContextMenuGroup,
-  ContextMenuPortal,
-  ContextMenuSub,
-  ContextMenuSubContent,
-  ContextMenuSubTrigger,
-  ContextMenuRadioGroup,
-}

package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/cell-variant-types.ts

@@ -1,11 +0,0 @@
-import type { Cell, Table } from '@tanstack/react-table'
-
-export type CellVariantProps<TData, TCell> = {
-  cell: Cell<TData, TCell>
-  table: Table<TData>
-  rowIndex: number
-  columnId: string
-  isEditing: boolean
-  isFocused: boolean
-  isSelected: boolean
-}

package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/checkbox-cell.tsx

@@ -1,116 +0,0 @@
-import * as React from 'react'
-
-import { Checkbox } from '@components/ui/checkbox/checkbox'
-import { DataGridCellWrapper } from '@components/ui/data-grid/data-grid-cell-wrapper'
-
-import { CellVariantProps } from './cell-variant-types'
-
-export function CheckboxCell<TData>({
-  cell,
-  table,
-  rowIndex,
-  columnId,
-  isFocused,
-  isSelected,
-}: Readonly<CellVariantProps<TData, boolean>>) {
-  const initialValue = cell.getValue()
-  const [value, setValue] = React.useState(Boolean(initialValue))
-  const containerRef = React.useRef<HTMLDivElement>(null)
-  const meta = table.options.meta
-  const colMeta = cell.column.columnDef.meta
-  // Normalize editable to a resolver function and memoize to avoid typeof checks per cell
-  const editableResolver = React.useMemo(() => {
-    const v = colMeta?.editable
-    if (v === undefined) {
-      return () => true
-    }
-    return typeof v === 'function' ? (v as (row: TData) => boolean) : () => Boolean(v)
-  }, [colMeta?.editable])
-  const isEditable = editableResolver(cell.row.original)
-
-  const onCheckedChange = React.useCallback(
-    (checked: boolean) => {
-      setValue(checked)
-      meta?.onDataUpdate?.({ rowIndex, columnId, value: checked })
-    },
-    [meta, rowIndex, columnId],
-  )
-
-  const onWrapperKeyDown = React.useCallback(
-    (event: React.KeyboardEvent<HTMLDivElement>) => {
-      if (!isEditable) {
-        return
-      }
-      if (isFocused && (event.key === '' || event.key === 'Enter')) {
-        event.preventDefault()
-        event.stopPropagation()
-        onCheckedChange(!value)
-      }
-    },
-    [isFocused, value, onCheckedChange, isEditable],
-  )
-
-  React.useEffect(() => {
-    setValue(Boolean(initialValue))
-  }, [initialValue])
-
-  React.useEffect(() => {
-    if (isFocused && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) {
-      containerRef.current.focus()
-    }
-  }, [isFocused, meta?.searchOpen, meta?.isScrolling])
-
-  const onWrapperClick = React.useCallback(
-    (event: React.MouseEvent) => {
-      if (!isEditable) {
-        return
-      }
-      if (isFocused) {
-        event.preventDefault()
-        event.stopPropagation()
-        onCheckedChange(!value)
-      }
-    },
-    [isFocused, value, onCheckedChange, isEditable],
-  )
-
-  const onCheckboxClick = React.useCallback((event: React.MouseEvent<HTMLInputElement>) => {
-    event.stopPropagation()
-  }, [])
-
-  const onCheckboxMouseDown = React.useCallback((event: React.MouseEvent<HTMLInputElement>) => {
-    event.stopPropagation()
-  }, [])
-
-  const onCheckboxDoubleClick = React.useCallback((event: React.MouseEvent<HTMLInputElement>) => {
-    event.stopPropagation()
-  }, [])
-
-  return (
-    <DataGridCellWrapper
-      ref={containerRef}
-      cell={cell}
-      table={table}
-      rowIndex={rowIndex}
-      columnId={columnId}
-      isEditing={false}
-      isFocused={isFocused}
-      isSelected={isSelected}
-      onClick={onWrapperClick}
-      onKeyDown={onWrapperKeyDown}
-      className="flex size-full justify-center"
-    >
-      <Checkbox
-        variant="simple"
-        iconStyle="simple"
-        checkIcon="check"
-        checked={value}
-        onChange={(event) => onCheckedChange(event.target.checked)}
-        onClick={onCheckboxClick}
-        onMouseDown={onCheckboxMouseDown}
-        onDoubleClick={onCheckboxDoubleClick}
-        className="border-secondary-foreground"
-      />
-    </DataGridCellWrapper>
-  )
-}