Fixing optgroup

docs/src/assets/styles.css

@@ -3176,8 +3176,9 @@
     background-size: 1rem;
     background-position: center right 0.75rem;
     background-repeat: no-repeat;
-    option {
+    option, optgroup {
       background-color: var(--color-popover);
+      color: var(--color-popover-foreground);
     }
   }
 }

packages/cli/index.js

@@ -62,17 +62,17 @@ async function ensureConfiguration() {
   const pathPrompts = [];
   if (!config.templateDest || config.templateDest === DEFAULT_CONFIG.templateDest) {
     pathPrompts.push({
-        type: 'input',
-        name: 'templateDest',
-        message: 'Where should template files be placed?',
+      type: 'input',
+      name: 'templateDest',
+      message: 'Where should template files be placed?',
         default: DEFAULT_CONFIG.templateDest,
     });
   }
   if (!config.scriptDest || config.scriptDest === DEFAULT_CONFIG.scriptDest) {
     pathPrompts.push({
-        type: 'input',
-        name: 'scriptDest',
-        message: 'Where should script files be placed?',
+      type: 'input',
+      name: 'scriptDest',
+      message: 'Where should script files be placed?',
         default: DEFAULT_CONFIG.scriptDest,
     });
   }
@@ -108,7 +108,7 @@ async function addComponent(componentName) {
     }
     if (!scriptExists) {
       console.error(`  Error: Script file for component '${componentName}' not found in CLI assets. Searched: ${scriptSource}`);
-    }
+}
     if (!templateExists || !scriptExists) return; // Skip this component if sources are missing
 
     await fs.ensureDir(path.dirname(templateDestPath));

packages/cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "basecoat-cli",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Add Basecoat components to your project",
   "author": "hunvreus",
   "license": "MIT",

packages/css/package.json

@@ -1,6 +1,6 @@
 {
   "name": "basecoat-css",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Tailwind CSS for Basecoat components",
   "author": {
     "name": "hunvreus",

src/css/basecoat.css

@@ -717,8 +717,9 @@
     @apply appearance-none border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent pl-3 pr-9 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 h-9;
     @apply bg-[image:var(--chevron-down-icon-50)] bg-no-repeat bg-position-[center_right_0.75rem] bg-size-[1rem];
 
-    option {
-      @apply bg-popover;
+    option,
+    optgroup {
+      @apply bg-popover text-popover-foreground;
     }
   }
 }