Skip to content

Instantly share code, notes, and snippets.

View xsanctom's full-sized avatar

xsanctom

0 followers · 1 following
View GitHub Profile
@xsanctom
xsanctom / index.html
Created October 4, 2025 13:23
AI-generated React component - SERV-3485
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AI Generated Component - SERV-3485</title>
<style>
body { font-family: system-ui; max-width: 1200px; margin: 40px auto; padding: 20px; background: #f9fafb; }
.header { background: white; padding: 24px; border-radius: 8px; margin-bottom: 24px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.code-block { background: #1e1e1e; color: #d4d4d4; padding: 20px; border-radius: 8px; overflow-x: auto; }
@xsanctom
xsanctom / index.html
Created October 4, 2025 13:22
AI-generated React component - SERV-3485
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AI Generated Component - SERV-3485</title>
<style>
body { font-family: system-ui; max-width: 1200px; margin: 40px auto; padding: 20px; background: #f9fafb; }
.header { background: white; padding: 24px; border-radius: 8px; margin-bottom: 24px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.code-block { background: #1e1e1e; color: #d4d4d4; padding: 20px; border-radius: 8px; overflow-x: auto; }
@xsanctom
xsanctom / index.html
Created October 4, 2025 12:48
AI-generated React component - SERV-3485
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Menu Category Modal</title>
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script>
@xsanctom
xsanctom / index.html
Created October 4, 2025 12:46
AI-generated React component - SERV-3485
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Menu Category Modal</title>
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script>
@xsanctom
xsanctom / index.html
Created October 4, 2025 12:42
AI-generated React component - SERV-3485
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Menu Category Modal</title>
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script>
@xsanctom
xsanctom / index.html
Created October 4, 2025 12:37
AI-generated React component - SERV-3485
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Menu Category Modal</title>
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script>
@xsanctom
xsanctom / index.html
Created October 4, 2025 12:36
AI-generated React component - SERV-3485
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Menu Category Modal</title>
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script>
@xsanctom
xsanctom / component.tsx
Created October 4, 2025 12:33
AI-generated React component - SERV-3485
import React, { useState, useEffect } from 'react';
import { X, Edit2, Trash2, Plus, Check, XIcon, GripVertical } from 'lucide-react';
// Types
interface Category {
id: string;
name: string;
isEditing: boolean;
isNew: boolean;
}
@xsanctom
xsanctom / MenuCategoryModal.tsx
Created October 4, 2025 12:23
AI-generated React component for SERV-3485
import React, { useState, useRef, useEffect } from 'react';
import { DragDropContext, Droppable, Draggable, DropResult } from 'react-beautiful-dnd';
import { GripVertical, Edit2, Trash2, Plus, X, Check } from 'lucide-react';
// ===========================
// TypeScript Types
// ===========================
interface Category {
id: string;