@wireweave/language-data 1.0.2 → 1.1.0

package/dist/codemirror/index.js

@@ -0,0 +1,1191 @@
+// src/attributes.ts
+var COMMON_ATTRIBUTES = [
+  // Spacing
+  "p",
+  "px",
+  "py",
+  "pt",
+  "pr",
+  "pb",
+  "pl",
+  "m",
+  "mx",
+  "my",
+  "mt",
+  "mr",
+  "mb",
+  "ml",
+  "gap",
+  // Size
+  "w",
+  "h",
+  "minW",
+  "maxW",
+  "minH",
+  "maxH",
+  // Flex
+  "flex",
+  "direction",
+  "justify",
+  "align",
+  "wrap",
+  // Grid
+  "span",
+  // Position
+  "x",
+  "y"
+];
+var ATTRIBUTES = [
+  // ============================================
+  // Spacing Attributes
+  // ============================================
+  { name: "p", type: "number", description: "Padding (all sides)", example: "p=4" },
+  { name: "px", type: "number", description: "Horizontal padding", example: "px=4" },
+  { name: "py", type: "number", description: "Vertical padding", example: "py=4" },
+  { name: "pt", type: "number", description: "Top padding", example: "pt=4" },
+  { name: "pr", type: "number", description: "Right padding", example: "pr=4" },
+  { name: "pb", type: "number", description: "Bottom padding", example: "pb=4" },
+  { name: "pl", type: "number", description: "Left padding", example: "pl=4" },
+  { name: "m", type: "number", description: "Margin (all sides)", example: "m=4" },
+  { name: "mx", type: "string", description: 'Horizontal margin (number or "auto")', example: "mx=auto" },
+  { name: "my", type: "number", description: "Vertical margin", example: "my=4" },
+  { name: "mt", type: "number", description: "Top margin", example: "mt=4" },
+  { name: "mr", type: "number", description: "Right margin", example: "mr=4" },
+  { name: "mb", type: "number", description: "Bottom margin", example: "mb=4" },
+  { name: "ml", type: "number", description: "Left margin", example: "ml=4" },
+  { name: "gap", type: "number", description: "Gap between children", example: "gap=4" },
+  // ============================================
+  // Size Attributes
+  // ============================================
+  { name: "w", type: "string", description: 'Width (number, "full", "auto", "screen", "fit")', example: "w=full" },
+  { name: "h", type: "string", description: 'Height (number, "full", "auto", "screen")', example: "h=full" },
+  { name: "width", type: "number", description: "Width in pixels (page only)", example: "width=400" },
+  { name: "height", type: "number", description: "Height in pixels (page only)", example: "height=300" },
+  { name: "minW", type: "number", description: "Minimum width", example: "minW=200" },
+  { name: "maxW", type: "number", description: "Maximum width", example: "maxW=600" },
+  { name: "minH", type: "number", description: "Minimum height", example: "minH=100" },
+  { name: "maxH", type: "number", description: "Maximum height", example: "maxH=400" },
+  // ============================================
+  // Flex/Grid Layout Attributes
+  // ============================================
+  { name: "flex", type: "boolean", description: "Enable flexbox", example: "flex" },
+  { name: "direction", type: "enum", values: ["row", "column", "row-reverse", "column-reverse"], description: "Flex direction", example: "direction=column" },
+  { name: "justify", type: "enum", values: ["start", "center", "end", "between", "around", "evenly"], description: "Main axis alignment", example: "justify=center" },
+  { name: "align", type: "enum", values: ["start", "center", "end", "stretch", "baseline"], description: "Cross axis alignment", example: "align=center" },
+  { name: "wrap", type: "boolean", description: "Enable flex wrap", example: "wrap" },
+  { name: "span", type: "number", description: "Grid column span (1-12)", example: "span=6" },
+  { name: "sm", type: "number", description: "Responsive span at 576px+", example: "sm=6" },
+  { name: "md", type: "number", description: "Responsive span at 768px+", example: "md=4" },
+  { name: "lg", type: "number", description: "Responsive span at 992px+", example: "lg=3" },
+  { name: "xl", type: "number", description: "Responsive span at 1200px+", example: "xl=2" },
+  { name: "order", type: "number", description: "Flex order", example: "order=1" },
+  // ============================================
+  // Position Attributes
+  // ============================================
+  { name: "x", type: "number", description: "Horizontal position", example: "x=100" },
+  { name: "y", type: "number", description: "Vertical position", example: "y=50" },
+  { name: "position", type: "enum", values: ["left", "right", "top", "bottom", "top-left", "top-center", "top-right", "bottom-left", "bottom-center", "bottom-right"], description: "Position preset", example: "position=left" },
+  // ============================================
+  // Visual Attributes
+  // ============================================
+  { name: "border", type: "boolean", description: "Show border", example: "border" },
+  { name: "rounded", type: "boolean", description: "Apply border radius", example: "rounded" },
+  { name: "shadow", type: "enum", values: ["none", "sm", "md", "lg", "xl"], description: "Box shadow", example: "shadow=md" },
+  { name: "bg", type: "enum", values: ["muted", "primary", "secondary"], description: "Background variant", example: "bg=muted" },
+  // ============================================
+  // Text Attributes
+  // ============================================
+  { name: "size", type: "enum", values: ["xs", "sm", "base", "md", "lg", "xl", "2xl", "3xl"], description: "Size preset", example: "size=lg" },
+  { name: "weight", type: "enum", values: ["normal", "medium", "semibold", "bold"], description: "Font weight", example: "weight=bold" },
+  { name: "level", type: "number", description: "Heading level (1-6)", example: "level=2" },
+  { name: "muted", type: "boolean", description: "Muted/dimmed style", example: "muted" },
+  { name: "bold", type: "boolean", description: "Bold text", example: "bold" },
+  // ============================================
+  // Button Variant Attributes
+  // ============================================
+  { name: "primary", type: "boolean", description: "Primary style", example: "primary" },
+  { name: "secondary", type: "boolean", description: "Secondary style", example: "secondary" },
+  { name: "outline", type: "boolean", description: "Outline style", example: "outline" },
+  { name: "ghost", type: "boolean", description: "Ghost/transparent style", example: "ghost" },
+  { name: "danger", type: "boolean", description: "Danger/destructive style", example: "danger" },
+  // ============================================
+  // Status Variant Attributes
+  // ============================================
+  { name: "variant", type: "enum", values: ["default", "primary", "secondary", "success", "warning", "danger", "info"], description: "Status variant", example: "variant=success" },
+  // ============================================
+  // Form Attributes
+  // ============================================
+  { name: "inputType", type: "enum", values: ["text", "email", "password", "number", "tel", "url", "search", "date"], description: "Input field type", example: "inputType=email" },
+  { name: "placeholder", type: "string", description: "Placeholder text", example: 'placeholder="Enter text"' },
+  { name: "value", type: "string", description: "Default value", example: 'value="default"' },
+  { name: "label", type: "string", description: "Field label", example: 'label="Name"' },
+  { name: "name", type: "string", description: "Form field name", example: 'name="field"' },
+  { name: "required", type: "boolean", description: "Required field", example: "required" },
+  { name: "disabled", type: "boolean", description: "Disabled state", example: "disabled" },
+  { name: "readonly", type: "boolean", description: "Read-only state", example: "readonly" },
+  { name: "checked", type: "boolean", description: "Checked state", example: "checked" },
+  { name: "loading", type: "boolean", description: "Loading state", example: "loading" },
+  { name: "rows", type: "number", description: "Textarea rows", example: "rows=4" },
+  { name: "min", type: "number", description: "Minimum value", example: "min=0" },
+  { name: "max", type: "number", description: "Maximum value", example: "max=100" },
+  { name: "step", type: "number", description: "Step increment", example: "step=1" },
+  // ============================================
+  // Content Attributes
+  // ============================================
+  { name: "title", type: "string", description: "Title text", example: 'title="Title"' },
+  { name: "src", type: "string", description: "Source URL", example: 'src="/image.png"' },
+  { name: "alt", type: "string", description: "Alt text", example: 'alt="Image"' },
+  { name: "href", type: "string", description: "Link URL", example: 'href="/path"' },
+  { name: "icon", type: "string", description: "Icon name", example: 'icon="home"' },
+  { name: "external", type: "boolean", description: "External link", example: "external" },
+  // ============================================
+  // State Attributes
+  // ============================================
+  { name: "active", type: "number", description: "Active index", example: "active=0" },
+  { name: "expanded", type: "boolean", description: "Expanded state", example: "expanded" },
+  { name: "centered", type: "boolean", description: "Center content", example: "centered" },
+  { name: "vertical", type: "boolean", description: "Vertical orientation", example: "vertical" },
+  { name: "scroll", type: "boolean", description: "Enable scrolling", example: "scroll" },
+  // ============================================
+  // Feedback Attributes
+  // ============================================
+  { name: "dismissible", type: "boolean", description: "Can be dismissed", example: "dismissible" },
+  { name: "indeterminate", type: "boolean", description: "Indeterminate state", example: "indeterminate" },
+  { name: "pill", type: "boolean", description: "Pill/rounded style", example: "pill" },
+  // ============================================
+  // Data Attributes
+  // ============================================
+  { name: "striped", type: "boolean", description: "Striped rows", example: "striped" },
+  { name: "bordered", type: "boolean", description: "Full borders", example: "bordered" },
+  { name: "hover", type: "boolean", description: "Hover effect", example: "hover" },
+  { name: "ordered", type: "boolean", description: "Ordered list", example: "ordered" },
+  { name: "none", type: "boolean", description: "No list markers", example: "none" },
+  // ============================================
+  // Page/Viewport Attributes
+  // ============================================
+  { name: "viewport", type: "string", description: 'Viewport size (e.g., "1440x900")', example: 'viewport="1440x900"' },
+  { name: "device", type: "string", description: "Device preset", example: 'device="iphone14"' }
+];
+var ATTRIBUTE_MAP = new Map(
+  ATTRIBUTES.map((attr) => [attr.name, attr])
+);
+var VALID_ATTRIBUTE_NAMES = new Set(
+  ATTRIBUTES.map((attr) => attr.name)
+);
+
+// src/components.ts
+var ALL_COMPONENTS = [
+  // ============================================
+  // Layout Components
+  // ============================================
+  {
+    name: "page",
+    nodeType: "Page",
+    category: "layout",
+    attributes: [...COMMON_ATTRIBUTES, "title", "width", "height", "viewport", "device", "centered"],
+    hasChildren: true,
+    description: "Root container for a wireframe page",
+    example: 'page "Dashboard" centered { ... }',
+    validChildren: ["header", "main", "footer", "sidebar", "section", "nav", "row", "col", "card"],
+    validParents: []
+  },
+  {
+    name: "header",
+    nodeType: "Header",
+    category: "layout",
+    attributes: [...COMMON_ATTRIBUTES, "border"],
+    hasChildren: true,
+    description: "Page header section",
+    example: "header h=56 border { ... }",
+    validParents: ["page"]
+  },
+  {
+    name: "main",
+    nodeType: "Main",
+    category: "layout",
+    attributes: [...COMMON_ATTRIBUTES, "scroll"],
+    hasChildren: true,
+    description: "Main content section",
+    example: "main p=6 scroll { ... }",
+    validParents: ["page"]
+  },
+  {
+    name: "footer",
+    nodeType: "Footer",
+    category: "layout",
+    attributes: [...COMMON_ATTRIBUTES, "border"],
+    hasChildren: true,
+    description: "Page footer section",
+    example: "footer h=48 border { ... }",
+    validParents: ["page"]
+  },
+  {
+    name: "sidebar",
+    nodeType: "Sidebar",
+    category: "layout",
+    attributes: [...COMMON_ATTRIBUTES, "position", "border", "bg"],
+    hasChildren: true,
+    description: "Side navigation or content area",
+    example: "sidebar w=240 border { ... }",
+    validParents: ["page"]
+  },
+  {
+    name: "section",
+    nodeType: "Section",
+    category: "layout",
+    attributes: [...COMMON_ATTRIBUTES, "title", "expanded"],
+    hasChildren: true,
+    description: "Grouped content section",
+    example: 'section "Settings" expanded { ... }'
+  },
+  // ============================================
+  // Grid Components
+  // ============================================
+  {
+    name: "row",
+    nodeType: "Row",
+    category: "grid",
+    attributes: [...COMMON_ATTRIBUTES, "border", "bg"],
+    hasChildren: true,
+    description: "Horizontal flex container",
+    example: "row flex gap=4 justify=between { ... }"
+  },
+  {
+    name: "col",
+    nodeType: "Col",
+    category: "grid",
+    attributes: [...COMMON_ATTRIBUTES, "sm", "md", "lg", "xl", "order", "border", "bg", "scroll"],
+    hasChildren: true,
+    description: "Vertical flex container or grid column",
+    example: "col span=6 md=4 { ... }"
+  },
+  // ============================================
+  // Container Components
+  // ============================================
+  {
+    name: "card",
+    nodeType: "Card",
+    category: "container",
+    attributes: [...COMMON_ATTRIBUTES, "title", "shadow", "border", "rounded"],
+    hasChildren: true,
+    description: "Card container with optional title",
+    example: 'card "Settings" p=4 shadow=md { ... }'
+  },
+  {
+    name: "modal",
+    nodeType: "Modal",
+    category: "container",
+    attributes: [...COMMON_ATTRIBUTES, "title"],
+    hasChildren: true,
+    description: "Modal dialog overlay",
+    example: 'modal "Confirm" w=400 { ... }'
+  },
+  {
+    name: "drawer",
+    nodeType: "Drawer",
+    category: "container",
+    attributes: [...COMMON_ATTRIBUTES, "title", "position"],
+    hasChildren: true,
+    description: "Slide-in drawer panel",
+    example: 'drawer "Menu" position=left { ... }'
+  },
+  {
+    name: "accordion",
+    nodeType: "Accordion",
+    category: "container",
+    attributes: [...COMMON_ATTRIBUTES, "title"],
+    hasChildren: true,
+    description: "Collapsible sections container",
+    example: 'accordion { section "FAQ 1" { ... } }'
+  },
+  // ============================================
+  // Text Components
+  // ============================================
+  {
+    name: "text",
+    nodeType: "Text",
+    category: "text",
+    attributes: [...COMMON_ATTRIBUTES, "size", "weight", "muted", "bold"],
+    hasChildren: false,
+    description: "Text content",
+    example: 'text "Hello World" size=lg weight=bold'
+  },
+  {
+    name: "title",
+    nodeType: "Title",
+    category: "text",
+    attributes: [...COMMON_ATTRIBUTES, "level", "size"],
+    hasChildren: false,
+    description: "Heading element (h1-h6)",
+    example: 'title "Welcome" level=2'
+  },
+  {
+    name: "link",
+    nodeType: "Link",
+    category: "text",
+    attributes: [...COMMON_ATTRIBUTES, "href", "external"],
+    hasChildren: false,
+    description: "Hyperlink text",
+    example: 'link "Learn more" href="/docs" external'
+  },
+  // ============================================
+  // Input Components
+  // ============================================
+  {
+    name: "input",
+    nodeType: "Input",
+    category: "input",
+    attributes: [...COMMON_ATTRIBUTES, "label", "inputType", "placeholder", "value", "disabled", "required", "readonly", "icon", "size", "rounded"],
+    hasChildren: false,
+    description: "Text input field",
+    example: 'input "Email" inputType=email placeholder="user@example.com" required'
+  },
+  {
+    name: "textarea",
+    nodeType: "Textarea",
+    category: "input",
+    attributes: [...COMMON_ATTRIBUTES, "label", "placeholder", "value", "rows", "disabled", "required"],
+    hasChildren: false,
+    description: "Multi-line text input",
+    example: 'textarea "Description" rows=4 placeholder="Enter description..."'
+  },
+  {
+    name: "select",
+    nodeType: "Select",
+    category: "input",
+    attributes: [...COMMON_ATTRIBUTES, "label", "placeholder", "value", "disabled", "required"],
+    hasChildren: false,
+    description: "Dropdown select",
+    example: 'select "Country" ["USA", "Canada", "UK"] placeholder="Select..."'
+  },
+  {
+    name: "checkbox",
+    nodeType: "Checkbox",
+    category: "input",
+    attributes: [...COMMON_ATTRIBUTES, "label", "checked", "disabled"],
+    hasChildren: false,
+    description: "Checkbox input",
+    example: 'checkbox "I agree to terms" checked'
+  },
+  {
+    name: "radio",
+    nodeType: "Radio",
+    category: "input",
+    attributes: [...COMMON_ATTRIBUTES, "label", "name", "checked", "disabled"],
+    hasChildren: false,
+    description: "Radio button input",
+    example: 'radio "Option A" name="choice" checked'
+  },
+  {
+    name: "switch",
+    nodeType: "Switch",
+    category: "input",
+    attributes: [...COMMON_ATTRIBUTES, "label", "checked", "disabled"],
+    hasChildren: false,
+    description: "Toggle switch",
+    example: 'switch "Dark mode" checked'
+  },
+  {
+    name: "slider",
+    nodeType: "Slider",
+    category: "input",
+    attributes: [...COMMON_ATTRIBUTES, "label", "min", "max", "value", "step", "disabled"],
+    hasChildren: false,
+    description: "Range slider",
+    example: 'slider "Volume" min=0 max=100 value=50'
+  },
+  {
+    name: "button",
+    nodeType: "Button",
+    category: "input",
+    attributes: [...COMMON_ATTRIBUTES, "primary", "secondary", "outline", "ghost", "danger", "size", "icon", "disabled", "loading"],
+    hasChildren: false,
+    description: "Clickable button",
+    example: 'button "Submit" primary icon=send'
+  },
+  // ============================================
+  // Display Components
+  // ============================================
+  {
+    name: "image",
+    nodeType: "Image",
+    category: "display",
+    attributes: [...COMMON_ATTRIBUTES, "src", "alt"],
+    hasChildren: false,
+    description: "Image placeholder",
+    example: "image w=200 h=150"
+  },
+  {
+    name: "placeholder",
+    nodeType: "Placeholder",
+    category: "display",
+    attributes: [...COMMON_ATTRIBUTES, "label"],
+    hasChildren: true,
+    description: "Generic placeholder",
+    example: 'placeholder "Banner Image" w=full h=200 { ... }'
+  },
+  {
+    name: "avatar",
+    nodeType: "Avatar",
+    category: "display",
+    attributes: [...COMMON_ATTRIBUTES, "name", "src", "size"],
+    hasChildren: false,
+    description: "User avatar",
+    example: 'avatar "John Doe" size=lg'
+  },
+  {
+    name: "badge",
+    nodeType: "Badge",
+    category: "display",
+    attributes: [...COMMON_ATTRIBUTES, "variant", "pill", "icon", "size"],
+    hasChildren: false,
+    description: "Status badge",
+    example: 'badge "New" variant=success pill'
+  },
+  {
+    name: "icon",
+    nodeType: "Icon",
+    category: "display",
+    attributes: [...COMMON_ATTRIBUTES, "size", "muted"],
+    hasChildren: false,
+    description: "Lucide icon",
+    example: 'icon "settings" size=lg'
+  },
+  // ============================================
+  // Data Components
+  // ============================================
+  {
+    name: "table",
+    nodeType: "Table",
+    category: "data",
+    attributes: [...COMMON_ATTRIBUTES, "striped", "bordered", "hover"],
+    hasChildren: false,
+    description: "Data table",
+    example: 'table striped bordered { columns ["Name", "Email"] row ["John", "john@example.com"] }'
+  },
+  {
+    name: "list",
+    nodeType: "List",
+    category: "data",
+    attributes: [...COMMON_ATTRIBUTES, "ordered", "none"],
+    hasChildren: false,
+    description: "List of items",
+    example: 'list ordered ["First", "Second", "Third"]'
+  },
+  // ============================================
+  // Feedback Components
+  // ============================================
+  {
+    name: "alert",
+    nodeType: "Alert",
+    category: "feedback",
+    attributes: [...COMMON_ATTRIBUTES, "variant", "dismissible", "icon"],
+    hasChildren: false,
+    description: "Alert message",
+    example: 'alert "Changes saved!" variant=success'
+  },
+  {
+    name: "toast",
+    nodeType: "Toast",
+    category: "feedback",
+    attributes: [...COMMON_ATTRIBUTES, "position", "variant"],
+    hasChildren: false,
+    description: "Toast notification",
+    example: 'toast "Item deleted" position=bottom-right variant=danger'
+  },
+  {
+    name: "progress",
+    nodeType: "Progress",
+    category: "feedback",
+    attributes: [...COMMON_ATTRIBUTES, "value", "max", "label", "indeterminate"],
+    hasChildren: false,
+    description: "Progress bar",
+    example: 'progress value=75 label="Uploading..."'
+  },
+  {
+    name: "spinner",
+    nodeType: "Spinner",
+    category: "feedback",
+    attributes: [...COMMON_ATTRIBUTES, "label", "size"],
+    hasChildren: false,
+    description: "Loading spinner",
+    example: "spinner size=lg"
+  },
+  // ============================================
+  // Overlay Components
+  // ============================================
+  {
+    name: "tooltip",
+    nodeType: "Tooltip",
+    category: "overlay",
+    attributes: [...COMMON_ATTRIBUTES, "position"],
+    hasChildren: false,
+    description: "Tooltip on hover",
+    example: 'tooltip "More info" position=top { icon "help-circle" }'
+  },
+  {
+    name: "popover",
+    nodeType: "Popover",
+    category: "overlay",
+    attributes: [...COMMON_ATTRIBUTES, "title"],
+    hasChildren: true,
+    description: "Popover panel",
+    example: 'popover "Details" { ... }'
+  },
+  {
+    name: "dropdown",
+    nodeType: "Dropdown",
+    category: "overlay",
+    attributes: [...COMMON_ATTRIBUTES],
+    hasChildren: false,
+    description: "Dropdown menu",
+    example: 'dropdown { item "Edit" icon=edit item "Delete" icon=trash danger }'
+  },
+  // ============================================
+  // Navigation Components
+  // ============================================
+  {
+    name: "nav",
+    nodeType: "Nav",
+    category: "navigation",
+    attributes: [...COMMON_ATTRIBUTES, "vertical"],
+    hasChildren: false,
+    description: "Navigation menu",
+    example: 'nav [{ label="Home" icon=home active }, { label="Settings" icon=settings }] vertical'
+  },
+  {
+    name: "tabs",
+    nodeType: "Tabs",
+    category: "navigation",
+    attributes: [...COMMON_ATTRIBUTES, "active"],
+    hasChildren: true,
+    description: "Tab navigation",
+    example: 'tabs { tab "General" active { ... } tab "Advanced" { ... } }'
+  },
+  {
+    name: "breadcrumb",
+    nodeType: "Breadcrumb",
+    category: "navigation",
+    attributes: [...COMMON_ATTRIBUTES],
+    hasChildren: false,
+    description: "Breadcrumb navigation",
+    example: 'breadcrumb [{ label="Home" href="/" }, { label="Products" }, { label="Details" }]'
+  },
+  // ============================================
+  // Divider Component
+  // ============================================
+  {
+    name: "divider",
+    nodeType: "Divider",
+    category: "layout",
+    attributes: [...COMMON_ATTRIBUTES, "vertical"],
+    hasChildren: false,
+    description: "Horizontal separator",
+    example: "divider my=4"
+  }
+];
+var COMPONENT_MAP = new Map(
+  ALL_COMPONENTS.map((comp) => [comp.name, comp])
+);
+var NODE_TYPE_MAP = new Map(
+  ALL_COMPONENTS.map((comp) => [comp.nodeType, comp])
+);
+var VALID_COMPONENT_NAMES = new Set(
+  ALL_COMPONENTS.map((comp) => comp.name)
+);
+
+// src/keywords.ts
+var CATEGORY_LABELS = {
+  layout: "Layout",
+  container: "Container",
+  grid: "Grid",
+  text: "Text",
+  input: "Input",
+  display: "Display",
+  data: "Data",
+  feedback: "Feedback",
+  overlay: "Overlay",
+  navigation: "Navigation"
+};
+var VALUE_KEYWORDS = [
+  // Booleans
+  "true",
+  "false",
+  // Button variants
+  "primary",
+  "secondary",
+  "outline",
+  "ghost",
+  // Status variants
+  "success",
+  "danger",
+  "warning",
+  "info",
+  "default",
+  // Sizes
+  "xs",
+  "sm",
+  "md",
+  "lg",
+  "xl",
+  "base",
+  "2xl",
+  "3xl",
+  // Flex alignment
+  "start",
+  "center",
+  "end",
+  "between",
+  "around",
+  "evenly",
+  "stretch",
+  "baseline",
+  // Positions
+  "left",
+  "right",
+  "top",
+  "bottom",
+  "top-left",
+  "top-center",
+  "top-right",
+  "bottom-left",
+  "bottom-center",
+  "bottom-right",
+  // Sizing
+  "full",
+  "auto",
+  "screen",
+  "fit",
+  // Font weights
+  "normal",
+  "medium",
+  "semibold",
+  "bold",
+  // Input types
+  "text",
+  "email",
+  "password",
+  "number",
+  "tel",
+  "url",
+  "search",
+  "date",
+  // Flex direction
+  "row",
+  "column",
+  "row-reverse",
+  "column-reverse",
+  // List
+  "none",
+  "nowrap"
+];
+
+// src/utils.ts
+function getComponent(name) {
+  return COMPONENT_MAP.get(name.toLowerCase());
+}
+function getAttribute(name) {
+  return ATTRIBUTE_MAP.get(name);
+}
+function getValidChildren(componentName) {
+  const component = getComponent(componentName);
+  if (!component || !component.hasChildren) return [];
+  if (component.validChildren === void 0) {
+    return ALL_COMPONENTS.filter((c) => c.name !== "page");
+  }
+  return component.validChildren.map((name) => getComponent(name)).filter((c) => c !== void 0);
+}
+function getComponentAttributes(componentName) {
+  const component = getComponent(componentName);
+  if (!component) return ATTRIBUTES;
+  return ATTRIBUTES.filter((attr) => component.attributes.includes(attr.name));
+}
+
+// src/codemirror/language.ts
+var COMPONENT_NAMES = ALL_COMPONENTS.map((c) => c.name);
+var ATTRIBUTE_NAMES = ATTRIBUTES.map((a) => a.name);
+var VALUE_KEYWORDS2 = [
+  // Sizes
+  "xs",
+  "sm",
+  "md",
+  "lg",
+  "xl",
+  "2xl",
+  "3xl",
+  // Weights
+  "thin",
+  "light",
+  "normal",
+  "medium",
+  "semibold",
+  "bold",
+  "extrabold",
+  // Alignments
+  "left",
+  "center",
+  "right",
+  "start",
+  "end",
+  "top",
+  "middle",
+  "bottom",
+  "between",
+  "around",
+  "evenly",
+  "stretch",
+  // Directions
+  "horizontal",
+  "vertical",
+  // Variants
+  "primary",
+  "secondary",
+  "outline",
+  "ghost",
+  "link",
+  "danger",
+  "info",
+  "success",
+  "warning",
+  "error",
+  // Boolean
+  "true",
+  "false",
+  // Devices
+  "mobile",
+  "tablet",
+  "desktop",
+  // Input types
+  "text",
+  "email",
+  "password",
+  "number",
+  "tel",
+  "url",
+  "search",
+  "date"
+];
+function createTokenizer() {
+  return {
+    token(stream) {
+      if (stream.eatSpace()) return null;
+      if (stream.match("//")) {
+        stream.skipToEnd();
+        return "comment";
+      }
+      if (stream.match(/"[^"]*"/)) {
+        return "string";
+      }
+      if (stream.match(/\d+/)) {
+        return "number";
+      }
+      for (const kw of COMPONENT_NAMES) {
+        if (stream.match(new RegExp(`^${kw}\\b`))) {
+          return "keyword";
+        }
+      }
+      for (const attr of ATTRIBUTE_NAMES) {
+        if (stream.match(new RegExp(`^${attr}\\b`))) {
+          return "propertyName";
+        }
+      }
+      for (const val of VALUE_KEYWORDS2) {
+        if (stream.match(new RegExp(`^${val}\\b`))) {
+          return "atom";
+        }
+      }
+      if (stream.match(/[=]/)) {
+        return "operator";
+      }
+      if (stream.match(/[{}[\]()]/)) {
+        return "bracket";
+      }
+      stream.next();
+      return null;
+    }
+  };
+}
+function getLanguageConfig() {
+  return {
+    commentTokens: { line: "//" },
+    closeBrackets: { brackets: ["(", "[", "{", '"'] },
+    indentOnInput: /^\s*\}$/
+  };
+}
+
+// src/codemirror/completion.ts
+function getCategoryLabel(category) {
+  return CATEGORY_LABELS[category] || category;
+}
+function findParentComponent(text, pos) {
+  let braceCount = 0;
+  for (let i = pos - 1; i >= 0; i--) {
+    if (text[i] === "}") braceCount++;
+    if (text[i] === "{") {
+      braceCount--;
+      if (braceCount < 0) {
+        const beforeBrace = text.substring(0, i);
+        const match = beforeBrace.match(/(\w+)(?:\s+"[^"]*")?\s*$/);
+        return match ? match[1] : null;
+      }
+    }
+  }
+  return null;
+}
+function createCompletionSource() {
+  return (context) => {
+    const { state, pos } = context;
+    const line = state.doc.lineAt(pos);
+    const textBefore = state.doc.sliceString(line.from, pos);
+    const fullText = state.doc.toString();
+    const wordMatch = textBefore.match(/(\w*)$/);
+    const word = wordMatch ? wordMatch[1] : "";
+    const from = pos - word.length;
+    const options = [];
+    const attrMatch = textBefore.match(/(\w+)\s*=\s*$/);
+    if (attrMatch) {
+      const attrName = attrMatch[1];
+      const attr = getAttribute(attrName);
+      if (attr && attr.type === "enum" && attr.values) {
+        attr.values.forEach((value) => {
+          options.push({
+            label: value,
+            type: "enum",
+            detail: `value for ${attrName}`
+          });
+        });
+      } else if (attr?.type === "number") {
+        [1, 2, 3, 4, 5, 6, 8, 10, 12, 16].forEach((n) => {
+          options.push({
+            label: String(n),
+            type: "constant",
+            detail: "number"
+          });
+        });
+      }
+      if (options.length > 0) {
+        return { from, options };
+      }
+    }
+    if (textBefore.match(/^\s*\w*$/) || textBefore.match(/\{\s*\w*$/)) {
+      const parentComponent = findParentComponent(fullText, pos);
+      const validChildren = parentComponent ? getValidChildren(parentComponent) : [];
+      const validChildNames = new Set(validChildren.map((c) => c.name));
+      const isRootLevel = !parentComponent;
+      ALL_COMPONENTS.forEach((comp) => {
+        const isValidInContext = isRootLevel ? comp.name === "page" : validChildNames.size === 0 || validChildNames.has(comp.name);
+        options.push({
+          label: comp.name,
+          type: isValidInContext ? "class" : "type",
+          detail: isValidInContext ? `${getCategoryLabel(comp.category)} (recommended)` : getCategoryLabel(comp.category),
+          info: comp.description,
+          boost: isValidInContext ? 10 : 0,
+          apply: comp.hasChildren ? `${comp.name} {
+	
+}` : comp.name
+        });
+      });
+      return { from, options };
+    }
+    const componentMatch = textBefore.match(/(\w+)(?:\s+"[^"]*")?\s+(\w*)$/);
+    if (componentMatch) {
+      const compName = componentMatch[1];
+      const component = getComponent(compName);
+      if (component) {
+        const attrs = getComponentAttributes(compName);
+        attrs.forEach((attr) => {
+          let apply = attr.name;
+          if (attr.type === "string") {
+            apply = `${attr.name}=""`;
+          } else if (attr.type === "number" || attr.type === "enum") {
+            apply = `${attr.name}=`;
+          }
+          options.push({
+            label: attr.name,
+            type: "property",
+            detail: attr.type,
+            info: attr.description,
+            apply
+          });
+        });
+      } else {
+        ATTRIBUTES.forEach((attr) => {
+          let apply = attr.name;
+          if (attr.type === "string") {
+            apply = `${attr.name}=""`;
+          } else if (attr.type === "number" || attr.type === "enum") {
+            apply = `${attr.name}=`;
+          }
+          options.push({
+            label: attr.name,
+            type: "property",
+            detail: attr.type,
+            info: attr.description,
+            apply
+          });
+        });
+      }
+      return { from, options };
+    }
+    ALL_COMPONENTS.forEach((comp) => {
+      options.push({
+        label: comp.name,
+        type: "class",
+        detail: getCategoryLabel(comp.category),
+        info: comp.description,
+        apply: comp.hasChildren ? `${comp.name} {
+	
+}` : comp.name
+      });
+    });
+    return { from, options };
+  };
+}
+
+// src/codemirror/hover.ts
+function getCategoryLabel2(category) {
+  return CATEGORY_LABELS[category] || category;
+}
+function getWordAt(text, pos) {
+  let from = pos;
+  let to = pos;
+  while (from > 0 && /\w/.test(text[from - 1])) from--;
+  while (to < text.length && /\w/.test(text[to])) to++;
+  if (from === to) return null;
+  return {
+    word: text.slice(from, to),
+    from,
+    to
+  };
+}
+function createHoverTooltipSource() {
+  return (view, pos, _side) => {
+    const { state } = view;
+    const text = state.doc.toString();
+    const wordInfo = getWordAt(text, pos);
+    if (!wordInfo) return null;
+    const { word, from, to } = wordInfo;
+    const component = getComponent(word);
+    if (component) {
+      return {
+        pos: from,
+        end: to,
+        above: true,
+        create() {
+          const dom = document.createElement("div");
+          dom.className = "cm-tooltip-hover";
+          dom.innerHTML = `
+            <div style="padding: 8px 12px; max-width: 400px;">
+              <div style="font-weight: bold; margin-bottom: 4px;">
+                ${component.name}
+                <span style="opacity: 0.7; font-weight: normal; font-size: 0.9em;">
+                  (${getCategoryLabel2(component.category)})
+                </span>
+              </div>
+              <div style="margin-bottom: 8px; opacity: 0.9;">${component.description}</div>
+              ${component.example ? `<code style="display: block; padding: 8px; background: rgba(0,0,0,0.1); border-radius: 4px; font-size: 0.85em; white-space: pre;">${component.example}</code>` : ""}
+              <div style="margin-top: 8px; font-size: 0.85em; opacity: 0.7;">
+                Attributes: ${component.attributes.join(", ")}
+              </div>
+            </div>
+          `;
+          return { dom };
+        }
+      };
+    }
+    const attribute = getAttribute(word);
+    if (attribute) {
+      let valueInfo = "";
+      if (attribute.type === "number") {
+        valueInfo = "Type: number";
+      } else if (attribute.type === "string") {
+        valueInfo = "Type: string";
+      } else if (attribute.type === "boolean") {
+        valueInfo = "Type: boolean";
+      } else if (attribute.type === "enum" && attribute.values) {
+        valueInfo = `Values: ${attribute.values.join(" | ")}`;
+      }
+      return {
+        pos: from,
+        end: to,
+        above: true,
+        create() {
+          const dom = document.createElement("div");
+          dom.className = "cm-tooltip-hover";
+          dom.innerHTML = `
+            <div style="padding: 8px 12px; max-width: 400px;">
+              <div style="font-weight: bold; margin-bottom: 4px;">
+                ${attribute.name}
+                <span style="opacity: 0.7; font-weight: normal; font-size: 0.9em;">(attribute)</span>
+              </div>
+              <div style="margin-bottom: 4px; opacity: 0.9;">${attribute.description}</div>
+              ${valueInfo ? `<div style="font-size: 0.85em; opacity: 0.8; font-family: monospace;">${valueInfo}</div>` : ""}
+              ${attribute.example ? `<div style="margin-top: 4px; font-size: 0.85em; opacity: 0.7;">Example: <code>${attribute.example}</code></div>` : ""}
+            </div>
+          `;
+          return { dom };
+        }
+      };
+    }
+    if (VALUE_KEYWORDS.includes(word)) {
+      const relatedAttrs = ATTRIBUTES.filter(
+        (a) => a.type === "enum" && a.values?.includes(word)
+      );
+      if (relatedAttrs.length > 0) {
+        return {
+          pos: from,
+          end: to,
+          above: true,
+          create() {
+            const dom = document.createElement("div");
+            dom.className = "cm-tooltip-hover";
+            dom.innerHTML = `
+              <div style="padding: 8px 12px; max-width: 300px;">
+                <div style="font-weight: bold; margin-bottom: 4px;">
+                  ${word}
+                  <span style="opacity: 0.7; font-weight: normal; font-size: 0.9em;">(value)</span>
+                </div>
+                <div style="font-size: 0.9em; opacity: 0.8;">
+                  Used in: ${relatedAttrs.map((a) => a.name).join(", ")}
+                </div>
+              </div>
+            `;
+            return { dom };
+          }
+        };
+      }
+    }
+    return null;
+  };
+}
+
+// src/codemirror/linting.ts
+function validateCode(text) {
+  const diagnostics = [];
+  const lines = text.split("\n");
+  let braceStack = [];
+  let hasPage = false;
+  let currentPos = 0;
+  for (let lineNum = 0; lineNum < lines.length; lineNum++) {
+    const line = lines[lineNum];
+    const lineStart = currentPos;
+    if (line.trim().startsWith("//")) {
+      currentPos += line.length + 1;
+      continue;
+    }
+    const pageMatch = line.match(/^\s*page\b/);
+    if (pageMatch) {
+      if (hasPage) {
+        const matchStart = lineStart + line.indexOf("page");
+        diagnostics.push({
+          from: matchStart,
+          to: matchStart + 4,
+          severity: "error",
+          message: "Only one page component is allowed."
+        });
+      }
+      hasPage = true;
+    }
+    const componentMatch = line.match(/^\s*(\w+)(?:\s|{|")/);
+    if (componentMatch) {
+      const compName = componentMatch[1];
+      if (!getComponent(compName) && !["true", "false"].includes(compName)) {
+        const beforeMatch = line.substring(0, componentMatch.index);
+        if (!beforeMatch.match(/=\s*$/)) {
+          const matchStart = lineStart + (componentMatch.index || 0);
+          diagnostics.push({
+            from: matchStart,
+            to: matchStart + compName.length,
+            severity: "warning",
+            message: `Unknown component: "${compName}"`
+          });
+        }
+      }
+    }
+    const attrRegex = /\b(\w+)\s*=/g;
+    let attrMatch;
+    while ((attrMatch = attrRegex.exec(line)) !== null) {
+      const attrName = attrMatch[1];
+      if (!getAttribute(attrName) && !getComponent(attrName)) {
+        const matchStart = lineStart + attrMatch.index;
+        diagnostics.push({
+          from: matchStart,
+          to: matchStart + attrName.length,
+          severity: "warning",
+          message: `Unknown attribute: "${attrName}"`
+        });
+      }
+    }
+    for (let col = 0; col < line.length; col++) {
+      if (line[col] === "{") {
+        const beforeBrace = line.substring(0, col);
+        const compMatch = beforeBrace.match(/(\w+)(?:\s+"[^"]*")?\s*$/);
+        braceStack.push({
+          line: lineNum,
+          col,
+          pos: lineStart + col,
+          component: compMatch ? compMatch[1] : void 0
+        });
+      } else if (line[col] === "}") {
+        if (braceStack.length === 0) {
+          diagnostics.push({
+            from: lineStart + col,
+            to: lineStart + col + 1,
+            severity: "error",
+            message: "Unmatched closing brace"
+          });
+        } else {
+          braceStack.pop();
+        }
+      }
+    }
+    const quotes = line.match(/"/g);
+    if (quotes && quotes.length % 2 !== 0) {
+      diagnostics.push({
+        from: lineStart,
+        to: lineStart + line.length,
+        severity: "error",
+        message: "Unclosed string"
+      });
+    }
+    currentPos += line.length + 1;
+  }
+  for (const brace of braceStack) {
+    diagnostics.push({
+      from: brace.pos,
+      to: brace.pos + 1,
+      severity: "error",
+      message: `Unclosed brace${brace.component ? ` (${brace.component})` : ""}`
+    });
+  }
+  if (!hasPage && text.trim()) {
+    diagnostics.push({
+      from: 0,
+      to: 0,
+      severity: "info",
+      message: "Consider starting with a page component."
+    });
+  }
+  return diagnostics;
+}
+function createLinter() {
+  return (view) => {
+    const text = view.state.doc.toString();
+    const diagnostics = validateCode(text);
+    return diagnostics.map((d) => ({
+      from: d.from,
+      to: d.to,
+      severity: d.severity,
+      message: d.message
+    }));
+  };
+}
+export {
+  createCompletionSource,
+  createHoverTooltipSource,
+  createLinter,
+  createTokenizer,
+  getLanguageConfig,
+  validateCode
+};
+//# sourceMappingURL=index.js.map