@classic-homes/theme-mcp 0.1.5 → 0.1.7

package/dist/cli.js

@@ -2389,7 +2389,7 @@ var component_catalog_default = {
         },
         {
           name: "options",
-          type: "SelectOption[]",
+          type: "ComboboxOption[]",
           default: "Required",
           required: false,
           description: "Array of options"
@@ -2397,6 +2397,7 @@ var component_catalog_default = {
         {
           name: "placeholder",
           type: "string",
+          default: "'Select an option...'",
           required: false,
           description: "Placeholder text"
         },
@@ -2431,7 +2432,19 @@ var component_catalog_default = {
           name: "id",
           type: "string",
           required: false,
-          description: "Element ID"
+          description: "Element ID (auto-generated if empty)"
+        },
+        {
+          name: "label",
+          type: "string",
+          required: false,
+          description: "Label text"
+        },
+        {
+          name: "hint",
+          type: "string",
+          required: false,
+          description: "Hint text below the input"
         },
         {
           name: "error",
@@ -2464,6 +2477,12 @@ var component_catalog_default = {
           type: "(query: string) => void",
           required: false,
           description: "Callback for search queries"
+        },
+        {
+          name: "class",
+          type: "string",
+          required: false,
+          description: "Additional CSS classes"
         }
       ],
       variants: [],
@@ -2492,11 +2511,11 @@ var component_catalog_default = {
         },
         {
           title: "User Search",
-          code: '<script>\n  let selectedUser = $state(\'\');\n  let users = $state([]);\n  let loading = $state(false);\n\n  async function searchUsers(query: string) {\n    if (!query) {\n      users = [];\n      return;\n    }\n    loading = true;\n    const response = await fetch(`/api/users?search=${query}`);\n    users = await response.json();\n    loading = false;\n  }\n</script>\n\n<Combobox\n  options={users}\n  bind:value={selectedUser}\n  onSearch={searchUsers}\n  {loading}\n  placeholder="Search users..."\n  emptyMessage="No users found"\n/>'
+          code: '<script>\n  let selectedUser = $state(\'\');\n  let users = $state([]);\n  let loading = $state(false);\n\n  async function searchUsers(query: string) {\n    if (!query) {\n      users = [];\n      return;\n    }\n    loading = true;\n    const response = await fetch(`/api/users?search=${query}`);\n    users = await response.json();\n    loading = false;\n  }\n</script>\n\n<Combobox\n  label="User"\n  options={users}\n  bind:value={selectedUser}\n  onSearch={searchUsers}\n  {loading}\n  placeholder="Search users..."\n  emptyMessage="No users found"\n/>'
         },
         {
           title: "Location Autocomplete",
-          code: '<Combobox\n  options={locations}\n  bind:value\n  onSearch={searchLocations}\n  placeholder="Enter city or zip code..."\n  emptyMessage="No locations found"\n/>'
+          code: '<Combobox\n  label="Location"\n  hint="Enter a city name or zip code"\n  options={locations}\n  bind:value\n  onSearch={searchLocations}\n  placeholder="Enter city or zip code..."\n  emptyMessage="No locations found"\n/>'
         }
       ],
       relatedComponents: [
@@ -3701,6 +3720,12 @@ var component_catalog_default = {
           required: false,
           description: "Label text"
         },
+        {
+          name: "hint",
+          type: "string",
+          required: false,
+          description: "Hint text below the picker"
+        },
         {
           name: "error",
           type: "string",
@@ -6622,7 +6647,7 @@ var component_catalog_default = {
         },
         {
           name: "options",
-          type: "SelectOption[]",
+          type: "MultiSelectOption[]",
           default: "Required",
           required: false,
           description: "Array of options"
@@ -6630,9 +6655,17 @@ var component_catalog_default = {
         {
           name: "placeholder",
           type: "string",
+          default: "'Select options...'",
           required: false,
           description: "Placeholder text"
         },
+        {
+          name: "emptyMessage",
+          type: "string",
+          default: "'No results found.'",
+          required: false,
+          description: "Message when no options match"
+        },
         {
           name: "disabled",
           type: "boolean",
@@ -6648,10 +6681,28 @@ var component_catalog_default = {
           description: "Marks as required"
         },
         {
-          name: "maxItems",
-          type: "number",
+          name: "name",
+          type: "string",
           required: false,
-          description: "Maximum selections allowed"
+          description: "Name attribute for forms"
+        },
+        {
+          name: "id",
+          type: "string",
+          required: false,
+          description: "Element ID (auto-generated if empty)"
+        },
+        {
+          name: "label",
+          type: "string",
+          required: false,
+          description: "Label text"
+        },
+        {
+          name: "hint",
+          type: "string",
+          required: false,
+          description: "Hint text below the input"
         },
         {
           name: "error",
@@ -6659,11 +6710,43 @@ var component_catalog_default = {
           required: false,
           description: "Error message"
         },
+        {
+          name: "max",
+          type: "number",
+          required: false,
+          description: "Maximum selections allowed"
+        },
+        {
+          name: "loading",
+          type: "boolean",
+          default: "false",
+          required: false,
+          description: "Shows loading state"
+        },
+        {
+          name: "debounceMs",
+          type: "number",
+          default: "300",
+          required: false,
+          description: "Debounce time for search"
+        },
         {
           name: "onValueChange",
           type: "(value: string[]) => void",
           required: false,
           description: "Callback when value changes"
+        },
+        {
+          name: "onSearch",
+          type: "(query: string) => void",
+          required: false,
+          description: "Callback for search queries"
+        },
+        {
+          name: "class",
+          type: "string",
+          required: false,
+          description: "Additional CSS classes"
         }
       ],
       variants: [],
@@ -6703,11 +6786,17 @@ var component_catalog_default = {
   ];
 </script>
 
-<MultiSelect label="Tags" options={tagOptions} bind:value={tags} placeholder="Add tags..." />`
+<MultiSelect
+  label="Tags"
+  hint="Add relevant tags"
+  options={tagOptions}
+  bind:value={tags}
+  placeholder="Add tags..."
+/>`
         },
         {
           title: "Team Members",
-          code: '<MultiSelect\n  label="Assign to"\n  options={teamMembers}\n  bind:value={assignees}\n  maxItems={5}\n  placeholder="Select team members..."\n/>'
+          code: '<MultiSelect\n  label="Assign to"\n  hint="Select team members to assign this task"\n  options={teamMembers}\n  bind:value={assignees}\n  max={5}\n  placeholder="Select team members..."\n/>'
         }
       ],
       relatedComponents: [
@@ -6852,8 +6941,8 @@ var component_catalog_default = {
       props: [
         {
           name: "value",
-          type: "number",
-          default: "0",
+          type: "number | null",
+          default: "null",
           required: false,
           description: "Current value (bindable)"
         },
@@ -6883,18 +6972,57 @@ var component_catalog_default = {
           required: false,
           description: "Disables the input"
         },
+        {
+          name: "readonly",
+          type: "boolean",
+          default: "false",
+          required: false,
+          description: "Makes input read-only"
+        },
+        {
+          name: "required",
+          type: "boolean",
+          default: "false",
+          required: false,
+          description: "Marks field as required"
+        },
         {
           name: "placeholder",
           type: "string",
           required: false,
           description: "Placeholder text"
         },
+        {
+          name: "name",
+          type: "string",
+          required: false,
+          description: "Name attribute for form submission"
+        },
+        {
+          name: "id",
+          type: "string",
+          required: false,
+          description: "Element ID (auto-generated if empty)"
+        },
+        {
+          name: "showStepper",
+          type: "boolean",
+          default: "true",
+          required: false,
+          description: "Show +/- stepper buttons"
+        },
         {
           name: "label",
           type: "string",
           required: false,
           description: "Label text"
         },
+        {
+          name: "hint",
+          type: "string",
+          required: false,
+          description: "Hint text below the input"
+        },
         {
           name: "error",
           type: "string",
@@ -6903,9 +7031,15 @@ var component_catalog_default = {
         },
         {
           name: "onValueChange",
-          type: "(value: number) => void",
+          type: "(value: number | null) => void",
           required: false,
           description: "Callback when value changes"
+        },
+        {
+          name: "class",
+          type: "string",
+          required: false,
+          description: "Additional CSS classes"
         }
       ],
       variants: [],
@@ -6968,17 +7102,48 @@ var component_catalog_default = {
           description: "Disables the input"
         },
         {
-          name: "error",
+          name: "required",
+          type: "boolean",
+          default: "false",
+          required: false,
+          description: "Marks field as required"
+        },
+        {
+          name: "type",
+          type: "'numeric' | 'alphanumeric'",
+          default: "'numeric'",
+          required: false,
+          description: "Input type"
+        },
+        {
+          name: "name",
           type: "string",
           required: false,
-          description: "Error message"
+          description: "Name attribute for form submission"
         },
         {
-          name: "autoFocus",
-          type: "boolean",
-          default: "false",
+          name: "id",
+          type: "string",
+          required: false,
+          description: "Element ID (auto-generated if empty)"
+        },
+        {
+          name: "label",
+          type: "string",
           required: false,
-          description: "Auto-focus first input"
+          description: "Label text"
+        },
+        {
+          name: "hint",
+          type: "string",
+          required: false,
+          description: "Hint text below the input"
+        },
+        {
+          name: "error",
+          type: "string",
+          required: false,
+          description: "Error message"
         },
         {
           name: "onComplete",
@@ -6991,9 +7156,24 @@ var component_catalog_default = {
           type: "(value: string) => void",
           required: false,
           description: "Callback when value changes"
+        },
+        {
+          name: "class",
+          type: "string",
+          required: false,
+          description: "Additional CSS classes"
+        }
+      ],
+      variants: [
+        {
+          name: "type",
+          values: [
+            "numeric",
+            "alphanumeric"
+          ],
+          default: "numeric"
         }
       ],
-      variants: [],
       slots: [
         {
           name: "children",
@@ -7031,8 +7211,13 @@ var component_catalog_default = {
 </script>
 
 <div class="text-center space-y-4">
-  <p class="text-muted-foreground">Enter the 6-digit code sent to your email</p>
-  <OTPInput bind:value={code} {error} autoFocus onComplete={handleComplete} />
+  <OTPInput
+    label="Verification Code"
+    hint="Enter the 6-digit code sent to your email"
+    bind:value={code}
+    {error}
+    onComplete={handleComplete}
+  />
   {#if verifying}
     <Spinner label="Verifying..." />
   {/if}
@@ -7040,7 +7225,7 @@ var component_catalog_default = {
         },
         {
           title: "Two-Factor Authentication",
-          code: "<OTPInput bind:value={twoFactorCode} length={6} autoFocus onComplete={verify2FA} />"
+          code: '<OTPInput\n  label="Authentication Code"\n  hint="Enter code from your authenticator app"\n  bind:value={twoFactorCode}\n  length={6}\n  onComplete={verify2FA}\n/>'
         }
       ],
       relatedComponents: [
@@ -7734,6 +7919,12 @@ var component_catalog_default = {
           required: false,
           description: "Group label"
         },
+        {
+          name: "hint",
+          type: "string",
+          required: false,
+          description: "Hint text below the radio group"
+        },
         {
           name: "orientation",
           type: "'horizontal' | 'vertical'",
@@ -7759,7 +7950,7 @@ var component_catalog_default = {
           name: "name",
           type: "string",
           required: false,
-          description: "Name attribute for forms"
+          description: "Name attribute for forms (auto-generated if empty)"
         },
         {
           name: "error",
@@ -7837,6 +8028,7 @@ var component_catalog_default = {
 
 <RadioGroup
   label="Shipping Method"
+  hint="Free shipping on orders over $50"
   name="shipping"
   options={shippingOptions}
   bind:value={shipping}
@@ -7874,6 +8066,7 @@ var component_catalog_default = {
           title: "Survey Scale",
           code: `<RadioGroup
   label="How satisfied are you?"
+  hint="1 = Very Dissatisfied, 5 = Very Satisfied"
   name="satisfaction"
   options={[
     { value: '1', label: 'Very Dissatisfied' },
@@ -8282,13 +8475,19 @@ var component_catalog_default = {
           name: "id",
           type: "string",
           required: false,
-          description: "Element ID for accessibility"
+          description: "Element ID (auto-generated if empty)"
         },
         {
           name: "label",
           type: "string",
           required: false,
-          description: "Optional label displayed above"
+          description: "Label text"
+        },
+        {
+          name: "hint",
+          type: "string",
+          required: false,
+          description: "Hint text below the select"
         },
         {
           name: "error",
@@ -9010,6 +9209,18 @@ var component_catalog_default = {
           required: false,
           description: "Label text"
         },
+        {
+          name: "hint",
+          type: "string",
+          required: false,
+          description: "Hint text below the slider"
+        },
+        {
+          name: "error",
+          type: "string",
+          required: false,
+          description: "Error message"
+        },
         {
           name: "showValue",
           type: "boolean",
@@ -9076,15 +9287,15 @@ var component_catalog_default = {
         },
         {
           title: "Volume Control",
-          code: '<script>\n  let volume = $state([70]);\n</script>\n\n<Slider\n  label="Volume"\n  bind:value={volume}\n  min={0}\n  max={100}\n  showValue\n  formatValue={(v) => `${v}%`}\n/>'
+          code: '<script>\n  let volume = $state([70]);\n</script>\n\n<Slider\n  label="Volume"\n  hint="Adjust speaker volume"\n  bind:value={volume}\n  min={0}\n  max={100}\n  showValue\n  formatValue={(v) => `${v}%`}\n/>'
         },
         {
           title: "Price Filter",
-          code: '<script>\n  let priceRange = $state([0, 500]);\n</script>\n\n<Slider\n  label="Price Range"\n  bind:value={priceRange}\n  min={0}\n  max={1000}\n  step={10}\n  showValue\n  formatValue={(v) => `$${v}`}\n/>'
+          code: '<script>\n  let priceRange = $state([0, 500]);\n</script>\n\n<Slider\n  label="Price Range"\n  hint="Filter products by price"\n  bind:value={priceRange}\n  min={0}\n  max={1000}\n  step={10}\n  showValue\n  formatValue={(v) => `$${v}`}\n/>'
         },
         {
           title: "Temperature",
-          code: '<script>\n  let temp = $state([72]);\n</script>\n\n<Slider\n  label="Temperature"\n  bind:value={temp}\n  min={60}\n  max={85}\n  showValue\n  formatValue={(v) => `${v}\xB0F`}\n/>'
+          code: '<script>\n  let temp = $state([72]);\n</script>\n\n<Slider\n  label="Temperature"\n  hint="Set thermostat temperature"\n  bind:value={temp}\n  min={60}\n  max={85}\n  showValue\n  formatValue={(v) => `${v}\xB0F`}\n/>'
         },
         {
           title: "Opacity Control",
@@ -9099,6 +9310,7 @@ var component_catalog_default = {
 
 <Slider
   label="Rating"
+  hint="Rate your experience"
   bind:value={rating}
   min={1}
   max={5}