{"version":3,"file":"litTheme.mjs","names":[],"sources":["../../../src/react-renderer/theme/litTheme.ts"],"sourcesContent":["import type { Types } from \"@a2ui/lit/0.8\";\n\n/**\n * Default theme for A2UI React components.\n *\n * This theme uses the same CSS class conventions as the Lit renderer,\n * ensuring visual consistency between React and Lit implementations.\n *\n * IMPORTANT: This theme must be kept in sync with the Lit renderer's internal\n * styling. If Lit components change their class maps, this file must be updated\n * to match. Ideally, Lit would export its default theme for direct import.\n *\n * Requires the structural styles to be injected:\n * @example\n * ```tsx\n * import { A2UIProvider } from '@a2ui/react';\n * import { injectStyles } from '@a2ui/react/styles';\n *\n * // Inject structural CSS at app startup\n * injectStyles();\n *\n * function App() {\n *   return (\n *     <A2UIProvider>\n *       <A2UIRenderer surfaceId=\"main\" />\n *     </A2UIProvider>\n *   );\n * }\n * ```\n */\n\n// =============================================================================\n// Element Styles (used for markdown rendering and form elements)\n// =============================================================================\n\nconst elementA = {\n  \"typography-f-sf\": true,\n  \"typography-fs-n\": true,\n  \"typography-w-500\": true,\n  \"layout-as-n\": true,\n  \"layout-dis-iflx\": true,\n  \"layout-al-c\": true,\n  \"typography-td-none\": true,\n  \"color-c-p40\": true,\n};\n\nconst elementAudio = {\n  \"layout-w-100\": true,\n};\n\nconst elementBody = {\n  \"typography-f-s\": true,\n  \"typography-fs-n\": true,\n  \"typography-w-400\": true,\n  \"layout-mt-0\": true,\n  \"layout-mb-2\": true,\n  \"typography-sz-bm\": true,\n  \"color-c-n10\": true,\n};\n\nconst elementButton = {\n  \"typography-f-sf\": true,\n  \"typography-fs-n\": true,\n  \"typography-w-500\": true,\n  \"layout-pt-3\": true,\n  \"layout-pb-3\": true,\n  \"layout-pl-5\": true,\n  \"layout-pr-5\": true,\n  \"layout-mb-1\": true,\n  \"border-br-16\": true,\n  \"border-bw-0\": true,\n  \"border-c-n70\": true,\n  \"border-bs-s\": true,\n  \"color-bgc-s30\": true,\n  \"behavior-ho-80\": true,\n};\n\nconst elementHeading = {\n  \"typography-f-sf\": true,\n  \"typography-fs-n\": true,\n  \"typography-w-500\": true,\n  \"layout-mt-0\": true,\n  \"layout-mb-2\": true,\n};\n\nconst elementIframe = {\n  \"behavior-sw-n\": true,\n};\n\nconst elementInput = {\n  \"typography-f-sf\": true,\n  \"typography-fs-n\": true,\n  \"typography-w-400\": true,\n  \"layout-pl-4\": true,\n  \"layout-pr-4\": true,\n  \"layout-pt-2\": true,\n  \"layout-pb-2\": true,\n  \"border-br-6\": true,\n  \"border-bw-1\": true,\n  \"color-bc-s70\": true,\n  \"border-bs-s\": true,\n  \"layout-as-n\": true,\n  \"color-c-n10\": true,\n};\n\nconst elementP = {\n  \"typography-f-s\": true,\n  \"typography-fs-n\": true,\n  \"typography-w-400\": true,\n  \"layout-m-0\": true,\n  \"typography-sz-bm\": true,\n  \"layout-as-n\": true,\n  \"color-c-n10\": true,\n};\n\nconst elementList = {\n  \"typography-f-s\": true,\n  \"typography-fs-n\": true,\n  \"typography-w-400\": true,\n  \"layout-m-0\": true,\n  \"typography-sz-bm\": true,\n  \"layout-as-n\": true,\n  \"color-c-n10\": true,\n};\n\nconst elementPre = {\n  \"typography-f-c\": true,\n  \"typography-fs-n\": true,\n  \"typography-w-400\": true,\n  \"typography-sz-bm\": true,\n  \"typography-ws-p\": true,\n  \"layout-as-n\": true,\n};\n\nconst elementTextarea = {\n  ...elementInput,\n  \"layout-r-none\": true,\n  \"layout-fs-c\": true,\n};\n\nconst elementVideo = {\n  \"layout-el-cv\": true,\n};\n\n// =============================================================================\n// Theme Export\n// =============================================================================\n\nexport const litTheme: Types.Theme = {\n  // ===========================================================================\n  // Additional Styles — map to CopilotKit CSS variables\n  // ===========================================================================\n\n  additionalStyles: {\n    Button: {\n      background: \"var(--primary, oklch(0.205 0 0))\",\n      color: \"var(--primary-foreground, oklch(0.985 0 0))\",\n      \"border-radius\": \"calc(var(--radius, 0.625rem) - 2px)\",\n      cursor: \"pointer\",\n      width: \"100%\",\n      \"--n-10\": \"var(--primary-foreground, oklch(0.985 0 0))\",\n      \"--n-35\": \"var(--primary-foreground, oklch(0.985 0 0))\",\n      \"--n-60\": \"var(--primary-foreground, oklch(0.985 0 0))\",\n    },\n    Card: {\n      background: \"var(--card, oklch(1 0 0))\",\n      border: \"1px solid var(--border, oklch(0.922 0 0))\",\n      \"border-radius\": \"var(--radius, 0.625rem)\",\n    },\n    // Applied directly to <input>/<textarea>\n    TextField: {\n      \"background-color\": \"var(--background, oklch(1 0 0))\",\n      \"border-color\": \"var(--input, oklch(0.922 0 0))\",\n      color: \"var(--foreground, oklch(0.145 0 0))\",\n      \"border-radius\": \"var(--radius, 0.625rem)\",\n    },\n    // Applied to <section> container — palette vars cascade to <input type=\"checkbox\"> inside\n    CheckBox: {\n      \"--p-100\": \"var(--background, oklch(1 0 0))\",\n      \"--p-60\": \"var(--input, oklch(0.922 0 0))\",\n      \"--n-30\": \"var(--foreground, oklch(0.145 0 0))\",\n    },\n    // Applied directly to <input>\n    DateTimeInput: {\n      \"background-color\": \"var(--background, oklch(1 0 0))\",\n      \"border-color\": \"var(--input, oklch(0.922 0 0))\",\n      color: \"var(--foreground, oklch(0.145 0 0))\",\n      \"border-radius\": \"var(--radius, 0.625rem)\",\n    },\n    Modal: {\n      \"--p-100\": \"var(--card, oklch(1 0 0))\",\n      \"--p-80\": \"var(--border, oklch(0.922 0 0))\",\n      \"border-radius\": \"var(--radius, 0.625rem)\",\n    },\n    // Applied to <section> wrapping markdown content\n    Text: {\n      color: \"var(--foreground, oklch(0.145 0 0))\",\n    },\n  },\n\n  components: {\n    // =========================================================================\n    // Content Components\n    // =========================================================================\n\n    AudioPlayer: {},\n\n    Divider: {},\n\n    Icon: {},\n\n    Image: {\n      all: {\n        \"border-br-5\": true,\n        \"layout-el-cv\": true,\n        \"layout-w-100\": true,\n        \"layout-h-100\": true,\n      },\n      avatar: { \"is-avatar\": true },\n      header: {},\n      icon: {},\n      largeFeature: {},\n      mediumFeature: {},\n      smallFeature: {},\n    },\n\n    Text: {\n      all: {\n        \"layout-w-100\": true,\n        \"layout-g-2\": true,\n      },\n      h1: {\n        \"typography-f-sf\": true,\n        \"typography-v-r\": true,\n        \"typography-w-400\": true,\n        \"layout-m-0\": true,\n        \"layout-p-0\": true,\n        \"typography-sz-hs\": true,\n      },\n      h2: {\n        \"typography-f-sf\": true,\n        \"typography-v-r\": true,\n        \"typography-w-400\": true,\n        \"layout-m-0\": true,\n        \"layout-p-0\": true,\n        \"typography-sz-tl\": true,\n      },\n      h3: {\n        \"typography-f-sf\": true,\n        \"typography-v-r\": true,\n        \"typography-w-400\": true,\n        \"layout-m-0\": true,\n        \"layout-p-0\": true,\n        \"typography-sz-tl\": true,\n      },\n      h4: {\n        \"typography-f-sf\": true,\n        \"typography-v-r\": true,\n        \"typography-w-400\": true,\n        \"layout-m-0\": true,\n        \"layout-p-0\": true,\n        \"typography-sz-bl\": true,\n      },\n      h5: {\n        \"typography-f-sf\": true,\n        \"typography-v-r\": true,\n        \"typography-w-400\": true,\n        \"layout-m-0\": true,\n        \"layout-p-0\": true,\n        \"typography-sz-bm\": true,\n      },\n      body: {},\n      caption: {},\n    },\n\n    Video: {\n      \"border-br-5\": true,\n      \"layout-el-cv\": true,\n    },\n\n    // =========================================================================\n    // Layout Components\n    // =========================================================================\n\n    Card: {\n      \"border-br-9\": true,\n      \"layout-p-4\": true,\n      \"color-bgc-n100\": true,\n    },\n\n    Column: {\n      \"layout-g-2\": true,\n    },\n\n    List: {\n      \"layout-g-4\": true,\n      \"layout-p-2\": true,\n    },\n\n    Modal: {\n      backdrop: {\n        \"color-bbgc-p60_20\": true,\n      },\n      element: {\n        \"border-br-2\": true,\n        \"color-bgc-p100\": true,\n        \"layout-p-4\": true,\n        \"border-bw-1\": true,\n        \"border-bs-s\": true,\n        \"color-bc-p80\": true,\n      },\n    },\n\n    Row: {\n      \"layout-g-4\": true,\n    },\n\n    Tabs: {\n      container: {},\n      controls: {\n        all: {},\n        selected: {},\n      },\n      element: {},\n    },\n\n    // =========================================================================\n    // Interactive Components\n    // =========================================================================\n\n    Button: {\n      \"layout-pt-2\": true,\n      \"layout-pb-2\": true,\n      \"layout-pl-3\": true,\n      \"layout-pr-3\": true,\n      \"border-bw-0\": true,\n      \"border-bs-s\": true,\n      \"typography-w-400\": true,\n    },\n\n    CheckBox: {\n      container: {\n        \"layout-dsp-iflex\": true,\n        \"layout-al-c\": true,\n      },\n      element: {\n        \"layout-m-0\": true,\n        \"layout-mr-2\": true,\n        \"layout-p-2\": true,\n        \"border-br-2\": true,\n        \"border-bw-1\": true,\n        \"border-bs-s\": true,\n        \"color-bgc-p100\": true,\n        \"color-bc-p60\": true,\n        \"color-c-n30\": true,\n      },\n      label: {\n        \"typography-f-sf\": true,\n        \"typography-v-r\": true,\n        \"typography-w-400\": true,\n        \"layout-flx-1\": true,\n        \"typography-sz-ll\": true,\n      },\n    },\n\n    DateTimeInput: {\n      container: {\n        \"typography-sz-bm\": true,\n        \"layout-w-100\": true,\n        \"layout-g-2\": true,\n        \"layout-dsp-flexvert\": true,\n      },\n      label: {\n        \"color-c-p30\": true,\n        \"typography-sz-bm\": true,\n      },\n      element: {\n        \"layout-pt-2\": true,\n        \"layout-pb-2\": true,\n        \"layout-pl-3\": true,\n        \"layout-pr-3\": true,\n        \"border-bw-1\": true,\n        \"border-bs-s\": true,\n      },\n    },\n\n    MultipleChoice: {\n      container: {},\n      label: {},\n      element: {},\n    },\n\n    Slider: {\n      container: {},\n      label: {},\n      element: {},\n    },\n\n    TextField: {\n      container: {\n        \"typography-sz-bm\": true,\n        \"layout-w-100\": true,\n        \"layout-g-2\": true,\n        \"layout-dsp-flexvert\": true,\n      },\n      label: {\n        \"layout-flx-0\": true,\n      },\n      element: {\n        \"typography-sz-bm\": true,\n        \"layout-pt-2\": true,\n        \"layout-pb-2\": true,\n        \"layout-pl-3\": true,\n        \"layout-pr-3\": true,\n        \"border-bw-1\": true,\n        \"border-bs-s\": true,\n      },\n    },\n  },\n\n  // ===========================================================================\n  // HTML Elements (used for markdown rendering and raw HTML)\n  // ===========================================================================\n\n  elements: {\n    a: elementA,\n    audio: elementAudio,\n    body: elementBody,\n    button: elementButton,\n    h1: elementHeading,\n    h2: elementHeading,\n    h3: elementHeading,\n    h4: elementHeading,\n    h5: elementHeading,\n    iframe: elementIframe,\n    input: elementInput,\n    p: elementP,\n    pre: elementPre,\n    textarea: elementTextarea,\n    video: elementVideo,\n  },\n\n  // ===========================================================================\n  // Markdown (class arrays for markdown-it renderer)\n  // ===========================================================================\n\n  markdown: {\n    p: Object.keys(elementP),\n    h1: Object.keys(elementHeading),\n    h2: Object.keys(elementHeading),\n    h3: Object.keys(elementHeading),\n    h4: Object.keys(elementHeading),\n    h5: Object.keys(elementHeading),\n    ul: Object.keys(elementList),\n    ol: Object.keys(elementList),\n    li: Object.keys(elementList),\n    a: Object.keys(elementA),\n    strong: [],\n    em: [\"typography-fs-n\"],\n  },\n};\n\n/**\n * Alias for litTheme - the default theme for A2UI React components.\n * @see litTheme\n */\nexport const defaultTheme = litTheme;\n"],"mappings":"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"}