@shell-shock/preset-script 0.6.77 → 0.6.79

package/dist/command-entry-DWSekIys.mjs

@@ -0,0 +1,339 @@
+import { CommandRouter } from "./components/command-router.mjs";
+import { createComponent, createIntrinsic, memo, mergeProps } from "@alloy-js/core/jsx-runtime";
+import { For, Show, code, computed } from "@alloy-js/core";
+import { ElseClause, FunctionDeclaration, IfStatement } from "@alloy-js/typescript";
+import { Spacing } from "@power-plant/alloy-js/core/components";
+import { Spacing as Spacing$1 } from "@power-plant/alloy-js/core/components/spacing";
+import { TSDoc, TSDocParam, TSDocRemarks, TSDocTitle } from "@power-plant/alloy-js/typescript/components/tsdoc";
+import { EntryFile, usePowerlines } from "@shell-shock/core/contexts/power-plant";
+import { getAppBin, getDynamicPathSegmentName, isDynamicPathSegment } from "@shell-shock/core/plugin-utils";
+import { replaceExtension } from "@stryke/path/replace";
+import { pascalCase } from "@stryke/string-format/pascal-case";
+import { defu } from "defu";
+import { CommandValidationLogic } from "@shell-shock/core/components/command-validation-logic";
+import { IsDebug } from "@shell-shock/core/components/helpers";
+import { CommandParserLogic, OptionsInterfaceDeclaration } from "@shell-shock/core/components/options-parser-logic";
+import { findFilePath, relativePath } from "@stryke/path/find";
+import { joinPaths } from "@stryke/path/join";
+import { camelCase } from "@stryke/string-format/camel-case";
+import { constantCase } from "@stryke/string-format/constant-case";
+import { TypescriptFile } from "@power-plant/alloy-js/typescript/components/typescript-file";
+
+//#region src/components/virtual-command-entry.tsx
+/**
+* A component that generates the `handler` function declaration for a command.
+*/
+function VirtualCommandHandlerDeclaration(props) {
+	const { command, children, banner } = props;
+	const context = usePowerlines();
+	return [createComponent(TSDoc, {
+		get heading() {
+			return `The ${command.title} (${getAppBin(context)} ${command.segments.map((segment) => isDynamicPathSegment(segment) ? `[${constantCase(getDynamicPathSegmentName(segment))}]` : segment).join(" ")}) virtual command.`;
+		},
+		get children() {
+			return [
+				createComponent(TSDocRemarks, { get children() {
+					return `${command.description.replace(/\.+$/, "")}.`;
+				} }),
+				createIntrinsic("hbr", {}),
+				createComponent(TSDocTitle, { get children() {
+					return command.title;
+				} }),
+				createComponent(TSDocParam, {
+					name: "args",
+					children: `The command-line arguments passed to the command.`
+				})
+			];
+		}
+	}), createComponent(FunctionDeclaration, {
+		"export": true,
+		async: true,
+		name: "handler",
+		parameters: [{
+			name: "args",
+			type: "string[]",
+			default: "useArgs()"
+		}],
+		get children() {
+			return [
+				createComponent(Spacing, {}),
+				children,
+				createComponent(Spacing, {}),
+				createComponent(Show, {
+					get when() {
+						return Boolean(banner);
+					},
+					children: banner
+				}),
+				createComponent(Spacing, {}),
+				code`return showHelp(); `
+			];
+		}
+	})];
+}
+/**
+* The virtual command entry point for the Shell Shock project.
+*/
+function VirtualCommandEntry(props) {
+	const { command, imports, builtinImports, ...rest } = props;
+	const context = usePowerlines();
+	const filePath = computed(() => joinPaths(context.entryPath, command.segments.filter((segment) => !isDynamicPathSegment(segment)).join("/"), "index.ts"));
+	return [createComponent(TypescriptFile, mergeProps(rest, {
+		get path() {
+			return filePath.value;
+		},
+		get imports() {
+			return defu(imports ?? {}, Object.entries(command.children).filter(([, child]) => child.virtual).reduce((ret, [name, child]) => {
+				ret[`./${child.name}`] = [{
+					name: "handler",
+					alias: `handle${pascalCase(name)}`
+				}];
+				return ret;
+			}, {}));
+		},
+		get builtinImports() {
+			return defu(builtinImports ?? {}, {
+				env: ["isDevelopment", "isDebug"],
+				console: [
+					"warn",
+					"error",
+					"writeLine",
+					"textColors"
+				],
+				utils: [
+					"isMinimal",
+					"isUnicodeSupported",
+					"findSuggestions"
+				],
+				state: [
+					{
+						name: "GlobalOptions",
+						type: true
+					},
+					"useGlobal",
+					"useGlobalOptions",
+					"withCommand",
+					"useArgs",
+					"hasFlag"
+				],
+				[joinPaths("help", ...command.segments.filter((segment) => !isDynamicPathSegment(segment)))]: ["showHelp"],
+				[joinPaths("banner", ...command.segments.filter((segment) => !isDynamicPathSegment(segment)))]: ["showBanner"]
+			});
+		},
+		get children() {
+			return [createComponent(Spacing, {}), createComponent(VirtualCommandHandlerDeclaration, {
+				command,
+				banner: code`await showBanner(); `,
+				get children() {
+					return createComponent(CommandRouter, {
+						get segments() {
+							return command.segments;
+						},
+						get commands() {
+							return command.children;
+						}
+					});
+				}
+			})];
+		}
+	})), createComponent(For, {
+		get each() {
+			return Object.values(command.children);
+		},
+		children: (child) => createComponent(Show, {
+			get when() {
+				return child.virtual;
+			},
+			get fallback() {
+				return createComponent(CommandEntry, { command: child });
+			},
+			get children() {
+				return createComponent(VirtualCommandEntry, { command: child });
+			}
+		})
+	})];
+}
+
+//#endregion
+//#region src/components/command-entry.tsx
+function CommandInvocation(props) {
+	const { command } = props;
+	return [memo(() => code` return withCommand("${command.path}", [${command.segments.map((segment) => isDynamicPathSegment(segment) ? camelCase(getDynamicPathSegmentName(segment)) : `"${segment}"`).join(", ")}], [${Object.keys(command.options).length > 0 ? `options` : ""}${command.args.length > 0 ? `${Object.keys(command.options).length > 0 ? ", " : ""}${command.args.map((arg) => camelCase(arg.name)).join(", ")}` : ""}], handle${pascalCase(command.name)}); `), createIntrinsic("hbr", {})];
+}
+/**
+* A component that generates the `handler` function declaration for a command.
+*/
+function CommandHandlerDeclaration(props) {
+	const { command, banner, children } = props;
+	const context = usePowerlines();
+	return [
+		createComponent(OptionsInterfaceDeclaration, { command }),
+		createComponent(Spacing$1, {}),
+		createComponent(TSDoc, {
+			get heading() {
+				return `The ${command.title} (${getAppBin(context)} ${command.segments.map((segment) => isDynamicPathSegment(segment) ? `[${constantCase(getDynamicPathSegmentName(segment))}]` : segment).join(" ")}) command.`;
+			},
+			get children() {
+				return [
+					createComponent(TSDocRemarks, { get children() {
+						return `${command.description.replace(/\.+$/, "")}.`;
+					} }),
+					createIntrinsic("hbr", {}),
+					createComponent(TSDocTitle, { get children() {
+						return command.title;
+					} }),
+					createComponent(TSDocParam, {
+						name: "args",
+						children: `The command-line arguments passed to the command.`
+					})
+				];
+			}
+		}),
+		createComponent(FunctionDeclaration, {
+			"export": true,
+			async: true,
+			name: "handler",
+			parameters: [{
+				name: "args",
+				type: "string[]",
+				default: "useArgs()"
+			}],
+			get children() {
+				return [
+					createComponent(CommandParserLogic, {
+						command,
+						get appSpecificEnvPrefix() {
+							return context.config.appSpecificEnvPrefix;
+						},
+						get isCaseSensitive() {
+							return context.config.isCaseSensitive;
+						}
+					}),
+					createComponent(Spacing$1, {}),
+					createComponent(Show, {
+						get when() {
+							return Boolean(banner);
+						},
+						children: banner
+					}),
+					createComponent(Spacing$1, {}),
+					createComponent(IfStatement, {
+						condition: code`!isHelp()`,
+						get children() {
+							return [code`writeLine("");`, createComponent(IfStatement, {
+								get condition() {
+									return createComponent(IsDebug, {});
+								},
+								children: code`writeLine(textColors.body.tertiary("Debug mode is enabled. Additional debug information may be logged to the console.")); `
+							})];
+						}
+					}),
+					createComponent(Spacing$1, {}),
+					children,
+					createComponent(Spacing$1, {}),
+					createComponent(IfStatement, {
+						condition: code`options.help`,
+						children: code`return showHelp(); `
+					}),
+					createComponent(ElseClause, { get children() {
+						return [createIntrinsic("hbr", {}), createComponent(CommandInvocation, { command })];
+					} })
+				];
+			}
+		})
+	];
+}
+/**
+* The command entry point for the Shell Shock project.
+*/
+function CommandEntry(props) {
+	const { command, imports, builtinImports, ...rest } = props;
+	const context = usePowerlines();
+	const filePath = computed(() => joinPaths(command.segments.filter((segment) => !isDynamicPathSegment(segment)).join("/"), "index.ts"));
+	const commandSourcePath = computed(() => replaceExtension(relativePath(joinPaths(context.entryPath, findFilePath(filePath.value)), command.entry.input?.file || command.entry.file)));
+	const typeDefinition = computed(() => ({
+		...command.entry,
+		output: command.id
+	}));
+	return [createComponent(EntryFile, mergeProps(rest, {
+		get path() {
+			return filePath.value;
+		},
+		get typeDefinition() {
+			return typeDefinition.value;
+		},
+		get imports() {
+			return defu(imports ?? {}, { [commandSourcePath.value.startsWith(".") ? commandSourcePath.value : `./${commandSourcePath.value}`]: `handle${pascalCase(command.name)}` });
+		},
+		get builtinImports() {
+			return defu(builtinImports ?? {}, {
+				env: [
+					"env",
+					"isDevelopment",
+					"isDebug"
+				],
+				console: [
+					"debug",
+					"warn",
+					"error",
+					"writeLine",
+					"textColors"
+				],
+				utils: ["isMinimal", "isUnicodeSupported"],
+				state: [
+					{
+						name: "GlobalOptions",
+						type: true
+					},
+					"useGlobal",
+					"useGlobalOptions",
+					"useArgs",
+					"hasFlag",
+					"isHelp",
+					"withCommand"
+				],
+				[joinPaths("help", ...command.segments.filter((segment) => !isDynamicPathSegment(segment)))]: ["showHelp"],
+				[joinPaths("banner", ...command.segments.filter((segment) => !isDynamicPathSegment(segment)))]: ["showBanner"]
+			});
+		},
+		get children() {
+			return [
+				createComponent(Spacing$1, {}),
+				createComponent(OptionsInterfaceDeclaration, { command }),
+				createComponent(Spacing$1, {}),
+				createComponent(CommandHandlerDeclaration, {
+					command,
+					banner: code`await showBanner(); `,
+					get children() {
+						return [createComponent(CommandValidationLogic, { command }), createComponent(IfStatement, {
+							condition: code`failures.length > 0`,
+							get children() {
+								return code`error(\`The following validation failures were found while processing the user provided input, and must be corrected before the \${italic("${command.title}")} command can be executed: \\n\\n\${failures.map(failure => " - " + failure).join("\\n")}\`);
+                options.help = true; `;
+							}
+						})];
+					}
+				})
+			];
+		}
+	})), createComponent(For, {
+		get each() {
+			return Object.values(command.children);
+		},
+		children: (child) => createComponent(Show, {
+			get when() {
+				return child.virtual;
+			},
+			get fallback() {
+				return createComponent(CommandEntry, { command: child });
+			},
+			get children() {
+				return createComponent(VirtualCommandEntry, { command: child });
+			}
+		})
+	})];
+}
+
+//#endregion
+export { VirtualCommandHandlerDeclaration as a, VirtualCommandEntry as i, CommandHandlerDeclaration as n, CommandInvocation as r, CommandEntry as t };
+//# sourceMappingURL=command-entry-DWSekIys.mjs.map

package/dist/command-entry-DWSekIys.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-entry-DWSekIys.mjs","names":[],"sources":[],"mappings":""}

package/dist/components/bin-entry.cjs

@@ -1,20 +1,17 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
 const require_components_exit_function_declaration = require('./exit-function-declaration.cjs');
 let _alloy_js_core_jsx_runtime = require("@alloy-js/core/jsx-runtime");
 let _alloy_js_core = require("@alloy-js/core");
 let _alloy_js_typescript = require("@alloy-js/typescript");
-let _powerlines_plugin_alloy_core_components_spacing = require("@powerlines/plugin-alloy/core/components/spacing");
-let _powerlines_plugin_alloy_core_contexts_context = require("@powerlines/plugin-alloy/core/contexts/context");
-let _powerlines_plugin_alloy_typescript_components_entry_file = require("@powerlines/plugin-alloy/typescript/components/entry-file");
-let _powerlines_plugin_alloy_typescript_components_tsdoc = require("@powerlines/plugin-alloy/typescript/components/tsdoc");
+let _power_plant_alloy_js_core_components_spacing = require("@power-plant/alloy-js/core/components/spacing");
+let _power_plant_alloy_js_typescript_components_tsdoc = require("@power-plant/alloy-js/typescript/components/tsdoc");
+let _shell_shock_core_contexts_power_plant = require("@shell-shock/core/contexts/power-plant");
 let _shell_shock_core_plugin_utils = require("@shell-shock/core/plugin-utils");
 let _stryke_helpers_get_unique = require("@stryke/helpers/get-unique");
 let _stryke_path_file_path_fns = require("@stryke/path/file-path-fns");
 let _stryke_path_replace = require("@stryke/path/replace");
 let _stryke_string_format_pascal_case = require("@stryke/string-format/pascal-case");
 let defu = require("defu");
-defu = require_runtime.__toESM(defu, 1);
 
 //#region src/components/bin-entry.tsx
 /**
@@ -22,7 +19,7 @@ defu = require_runtime.__toESM(defu, 1);
 */
 function RunApplication() {
 	return [
-		(0, _alloy_js_core_jsx_runtime.createComponent)(_powerlines_plugin_alloy_core_components_spacing.Spacing, {}),
+		(0, _alloy_js_core_jsx_runtime.createComponent)(_power_plant_alloy_js_core_components_spacing.Spacing, {}),
 		_alloy_js_core.code`// Run the application main logic inside an asynchronous IIFE
       (async () => {
         const startDate = new Date();
@@ -98,13 +95,18 @@ function RunApplication() {
 */
 function BinEntry(props) {
 	const { prefix, postfix, builtinImports, imports, children, ...rest } = props;
-	const context = (0, _powerlines_plugin_alloy_core_contexts_context.usePowerlines)();
-	const bins = (0, _alloy_js_core.computed)(() => (0, _stryke_helpers_get_unique.getUnique)(Object.values(context.config.bin)));
+	const context = (0, _shell_shock_core_contexts_power_plant.usePowerlines)();
+	const bins = (0, _alloy_js_core.computed)(() => {
+		const binConfig = context.config.bin;
+		if (!binConfig) return [];
+		const values = Array.isArray(binConfig) ? binConfig : typeof binConfig === "string" ? [binConfig] : Object.values(binConfig);
+		return (0, _stryke_helpers_get_unique.getUnique)(values.filter((value) => typeof value === "string"));
+	});
 	return (0, _alloy_js_core_jsx_runtime.createComponent)(_alloy_js_core.For, {
 		get each() {
 			return bins.value;
 		},
-		children: (bin) => (0, _alloy_js_core_jsx_runtime.createComponent)(_powerlines_plugin_alloy_typescript_components_entry_file.EntryFile, (0, _alloy_js_core_jsx_runtime.mergeProps)(rest, {
+		children: (bin) => (0, _alloy_js_core_jsx_runtime.createComponent)(_shell_shock_core_contexts_power_plant.EntryFile, (0, _alloy_js_core_jsx_runtime.mergeProps)(rest, {
 			get path() {
 				return (0, _stryke_path_file_path_fns.findFileName)((0, _stryke_path_replace.replaceExtension)(bin));
 			},
@@ -114,7 +116,7 @@ function BinEntry(props) {
 				input: { file: bin }
 			},
 			get imports() {
-				return (0, defu.default)(imports ?? {}, Object.entries(context.commands).filter(([, command]) => command.virtual).reduce((ret, [name, command]) => {
+				return (0, defu.defu)(imports ?? {}, Object.entries(context.commands).filter(([, command]) => command.virtual).reduce((ret, [name, command]) => {
 					ret[`./${command.name}`] = [{
 						name: "handler",
 						alias: `handle${(0, _stryke_string_format_pascal_case.pascalCase)(name)}`
@@ -123,7 +125,7 @@ function BinEntry(props) {
 				}, {}));
 			},
 			get builtinImports() {
-				return (0, defu.default)(builtinImports ?? {}, {
+				return (0, defu.defu)(builtinImports ?? {}, {
 					env: [
 						"env",
 						"isDevelopment",
@@ -152,23 +154,23 @@ function BinEntry(props) {
 			get children() {
 				return [
 					(0, _alloy_js_core_jsx_runtime.createComponent)(require_components_exit_function_declaration.ExitFunctionDeclaration, {}),
-					(0, _alloy_js_core_jsx_runtime.createComponent)(_powerlines_plugin_alloy_core_components_spacing.Spacing, {}),
+					(0, _alloy_js_core_jsx_runtime.createComponent)(_power_plant_alloy_js_core_components_spacing.Spacing, {}),
 					(0, _alloy_js_core_jsx_runtime.createComponent)(_alloy_js_core.Show, {
 						get when() {
 							return Boolean(prefix);
 						},
 						get children() {
-							return [prefix, (0, _alloy_js_core_jsx_runtime.createComponent)(_powerlines_plugin_alloy_core_components_spacing.Spacing, {})];
+							return [prefix, (0, _alloy_js_core_jsx_runtime.createComponent)(_power_plant_alloy_js_core_components_spacing.Spacing, {})];
 						}
 					}),
-					(0, _alloy_js_core_jsx_runtime.createComponent)(_powerlines_plugin_alloy_typescript_components_tsdoc.TSDoc, {
+					(0, _alloy_js_core_jsx_runtime.createComponent)(_power_plant_alloy_js_typescript_components_tsdoc.TSDoc, {
 						get heading() {
 							return `Binary entry point for the ${(0, _shell_shock_core_plugin_utils.getAppTitle)(context, true)} command-line interface application.`;
 						},
 						get children() {
-							return [(0, _alloy_js_core_jsx_runtime.createComponent)(_powerlines_plugin_alloy_typescript_components_tsdoc.TSDocRemarks, { get children() {
+							return [(0, _alloy_js_core_jsx_runtime.createComponent)(_power_plant_alloy_js_typescript_components_tsdoc.TSDocRemarks, { get children() {
 								return `This file serves as the main entry point for the binary executable of the ${(0, _shell_shock_core_plugin_utils.getAppTitle)(context, true)} command-line interface application. It sets up the necessary environment and runs the application logic with proper exit handling. The main function is defined within this file, and the application is executed inside an asynchronous IIFE to allow for the use of async/await syntax. The file also includes signal handling for graceful shutdowns and error handling for uncaught exceptions and unhandled promise rejections.`;
-							} }), (0, _alloy_js_core_jsx_runtime.createComponent)(_powerlines_plugin_alloy_typescript_components_tsdoc.TSDocReturns, { children: `Returns a promise that resolves to either a successful result or an error object.` })];
+							} }), (0, _alloy_js_core_jsx_runtime.createComponent)(_power_plant_alloy_js_typescript_components_tsdoc.TSDocReturns, { children: `Returns a promise that resolves to either a successful result or an error object.` })];
 						}
 					}),
 					(0, _alloy_js_core_jsx_runtime.createComponent)(_alloy_js_typescript.FunctionDeclaration, {
@@ -184,7 +186,7 @@ function BinEntry(props) {
               return; `;
 									}
 								}),
-								(0, _alloy_js_core_jsx_runtime.createComponent)(_powerlines_plugin_alloy_core_components_spacing.Spacing, {}),
+								(0, _alloy_js_core_jsx_runtime.createComponent)(_power_plant_alloy_js_core_components_spacing.Spacing, {}),
 								children,
 								(0, _alloy_js_core_jsx_runtime.createIntrinsic)("hbr", {})
 							];

package/dist/components/bin-entry.d.cts

@@ -1,12 +1,11 @@
 import { Children } from "@alloy-js/core";
-import { EntryFileProps } from "@powerlines/plugin-alloy/typescript/components/entry-file";
-
+import { EntryFileProps } from "@shell-shock/core/contexts/power-plant";
 //#region src/components/bin-entry.d.ts
 /**
  * Runs the application main logic with proper exit handling.
  */
 declare function RunApplication(): Children;
-interface BinEntryProps extends Omit<EntryFileProps, "path" | "hashbang"> {
+interface BinEntryProps extends Omit<EntryFileProps, "path" | "hashbang" | "prefix" | "postfix"> {
   prefix?: Children;
   postfix?: Children;
   children: Children;

package/dist/components/bin-entry.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"bin-entry.d.cts","names":[],"sources":["../../src/components/bin-entry.tsx"],"mappings":";;;;;;AA4CA;iBAAgB,cAAA,IAAc,QAAA;AAAA,UA4Eb,aAAA,SAAsB,IAAA,CACrC,cAAA;EAGA,MAAA,GAAS,QAAA;EACT,OAAA,GAAU,QAAA;EACV,QAAA,EAAU,QAAA;AAAA;;;;iBAMI,QAAA,CAAS,KAAA,EAAO,aAAA,GAAa,QAAA"}
+{"version":3,"file":"bin-entry.d.cts","names":[],"sources":["../../src/components/bin-entry.tsx"],"mappings":";;;;;;iBA6CgB,kBAAc;UA4Eb,sBAAsB,KACrC;EAGA,SAAS;EACT,UAAU;EACV,UAAU;;;;;iBAMI,SAAS,OAAO,gBAAa"}

package/dist/components/bin-entry.d.mts

@@ -1,12 +1,11 @@
 import { Children } from "@alloy-js/core";
-import { EntryFileProps } from "@powerlines/plugin-alloy/typescript/components/entry-file";
-
+import { EntryFileProps } from "@shell-shock/core/contexts/power-plant";
 //#region src/components/bin-entry.d.ts
 /**
  * Runs the application main logic with proper exit handling.
  */
 declare function RunApplication(): Children;
-interface BinEntryProps extends Omit<EntryFileProps, "path" | "hashbang"> {
+interface BinEntryProps extends Omit<EntryFileProps, "path" | "hashbang" | "prefix" | "postfix"> {
   prefix?: Children;
   postfix?: Children;
   children: Children;

package/dist/components/bin-entry.mjs

@@ -2,16 +2,15 @@ import { ExitFunctionDeclaration } from "./exit-function-declaration.mjs";
 import { createComponent, createIntrinsic, memo, mergeProps } from "@alloy-js/core/jsx-runtime";
 import { For, Show, code, computed } from "@alloy-js/core";
 import { FunctionDeclaration, IfStatement } from "@alloy-js/typescript";
-import { Spacing } from "@powerlines/plugin-alloy/core/components/spacing";
-import { usePowerlines } from "@powerlines/plugin-alloy/core/contexts/context";
-import { EntryFile } from "@powerlines/plugin-alloy/typescript/components/entry-file";
-import { TSDoc, TSDocRemarks, TSDocReturns } from "@powerlines/plugin-alloy/typescript/components/tsdoc";
+import { Spacing } from "@power-plant/alloy-js/core/components/spacing";
+import { TSDoc, TSDocRemarks, TSDocReturns } from "@power-plant/alloy-js/typescript/components/tsdoc";
+import { EntryFile, usePowerlines } from "@shell-shock/core/contexts/power-plant";
 import { getAppTitle } from "@shell-shock/core/plugin-utils";
 import { getUnique } from "@stryke/helpers/get-unique";
 import { findFileName } from "@stryke/path/file-path-fns";
 import { replaceExtension } from "@stryke/path/replace";
 import { pascalCase } from "@stryke/string-format/pascal-case";
-import defu from "defu";
+import { defu } from "defu";
 
 //#region src/components/bin-entry.tsx
 /**
@@ -96,7 +95,12 @@ function RunApplication() {
 function BinEntry(props) {
 	const { prefix, postfix, builtinImports, imports, children, ...rest } = props;
 	const context = usePowerlines();
-	const bins = computed(() => getUnique(Object.values(context.config.bin)));
+	const bins = computed(() => {
+		const binConfig = context.config.bin;
+		if (!binConfig) return [];
+		const values = Array.isArray(binConfig) ? binConfig : typeof binConfig === "string" ? [binConfig] : Object.values(binConfig);
+		return getUnique(values.filter((value) => typeof value === "string"));
+	});
 	return createComponent(For, {
 		get each() {
 			return bins.value;