// import { CalendarItem } from '@based/ui'

// export const meta: Based.UI.Extractor.MetaDescriptor = {
//   name: 'Calendar Item',
//   group: 'Interactables',
//   section: 'components',
//   icon: 'edit',
//   component: CalendarItem,
//   subtitle:
//     'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
//   showApi: true,
//   showUsage: true,
// }

// export const blocks: Based.UI.Extractor.BlocksDescriptor[] = [
//   {
//     name: 'Default',
//     type: 'component',
//     description: 'Et harum quidem rerum facilis est et expedita distinctio.',
//     style: {
//       size: '100%',
//       frame: false,
//     },
//     render: () => {
//       return (
//         <div
//           style={{
//             display: 'grid',
//             gap: 20,
//             gridTemplateColumns: 'repeat(4, auto)',
//           }}
//         >
//           {([undefined, 'start', 'middle', 'end'] as const).map((position) =>
//             (['neutral', 'green', 'blue', 'orange', 'red'] as const).map(
//               (color) =>
//                 ([false, true] as const).map((repeating) =>
//                   ([undefined, 'Description'] as const).map(
//                     (description, index) => (
//                       <CalendarItem
//                         key={`${position}-${color}-${repeating}-${description}-${index}`}
//                         repeating={repeating}
//                         position={position}
//                         color={color}
//                         description={description}
//                         title="Title"
//                         onClick={() => {}}
//                       />
//                     ),
//                   ),
//                 ),
//             ),
//           )}
//         </div>
//       )
//     },
//   },
// ]
