@bysages/svelte 0.3.1 → 0.4.0

package/dist/{calendar-BMXmRdwJ.mjs → calendar-BXWvgkjq.mjs}

@@ -1,3 +1,5 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
+import { t as InternalIcon } from "./InternalIcon-Clwbj4MY.mjs";
 import { injectComponentStyle } from "@bysages/core";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
@@ -33,18 +35,17 @@ const title = ($$anchor, dp = $.noop) => {
 	$.append($$anchor, fragment);
 };
 const header = ($$anchor) => {
-	var div = root_3();
+	var div = root_1();
 	var node_1 = $.child(div);
 	$.component(node_1, () => DatePicker.ViewControl, ($$anchor, ArkDatePicker_ViewControl) => {
 		ArkDatePicker_ViewControl($$anchor, {
 			children: ($$anchor, $$slotProps) => {
-				var fragment_4 = root_2();
+				var fragment_4 = root();
 				var node_2 = $.first_child(fragment_4);
 				$.component(node_2, () => DatePicker.PrevTrigger, ($$anchor, ArkDatePicker_PrevTrigger) => {
 					ArkDatePicker_PrevTrigger($$anchor, {
 						children: ($$anchor, $$slotProps) => {
-							var svg = root();
-							$.append($$anchor, svg);
+							InternalIcon($$anchor, { name: "chevron-left" });
 						},
 						$$slots: { default: true }
 					});
@@ -53,8 +54,8 @@ const header = ($$anchor) => {
 				$.component(node_3, () => DatePicker.ViewTrigger, ($$anchor, ArkDatePicker_ViewTrigger) => {
 					ArkDatePicker_ViewTrigger($$anchor, {
 						children: ($$anchor, $$slotProps) => {
-							var fragment_5 = $.comment();
-							var node_4 = $.first_child(fragment_5);
+							var fragment_6 = $.comment();
+							var node_4 = $.first_child(fragment_6);
 							{
 								const children = ($$anchor, dp = $.noop) => {
 									title($$anchor, dp);
@@ -66,7 +67,7 @@ const header = ($$anchor) => {
 									});
 								});
 							}
-							$.append($$anchor, fragment_5);
+							$.append($$anchor, fragment_6);
 						},
 						$$slots: { default: true }
 					});
@@ -75,8 +76,7 @@ const header = ($$anchor) => {
 				$.component(node_5, () => DatePicker.NextTrigger, ($$anchor, ArkDatePicker_NextTrigger) => {
 					ArkDatePicker_NextTrigger($$anchor, {
 						children: ($$anchor, $$slotProps) => {
-							var svg_1 = root_1();
-							$.append($$anchor, svg_1);
+							InternalIcon($$anchor, { name: "chevron-right" });
 						},
 						$$slots: { default: true }
 					});
@@ -99,17 +99,15 @@ var rest_excludes = /* @__PURE__ */ new Set([
 	"onValueChange",
 	"children"
 ]);
-var root = $.from_svg(`<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><path d="m15 5-7 7 7 7"></path></svg>`);
-var root_1 = $.from_svg(`<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><path d="m9 5 7 7-7 7"></path></svg>`);
-var root_2 = $.from_html(`<!> <!> <!>`, 1);
-var root_3 = $.from_html(`<div data-scope="calendar" data-part="header"><!></div>`);
-var root_4 = $.from_html(`<!> <!>`, 1);
-var root_5 = $.from_html(`<div><!> <!></div>`);
+var root = $.from_html(`<!> <!> <!>`, 1);
+var root_1 = $.from_html(`<div data-scope="calendar" data-part="header"><!></div>`);
+var root_2 = $.from_html(`<!> <!>`, 1);
+var root_3 = $.from_html(`<div><!> <!></div>`);
 function Calendar$1($$anchor, $$props) {
 	$.push($$props, true);
 	injectComponentStyle("calendar");
 	let rest = $.rest_props($$props, rest_excludes);
-	var div_1 = root_5();
+	var div_1 = root_3();
 	$.attribute_effect(div_1, () => ({
 		...rest,
 		"data-scope": "calendar",
@@ -132,38 +130,38 @@ function Calendar$1($$anchor, $$props) {
 			},
 			onValueChange: (details) => $$props.onValueChange?.(details.value),
 			children: ($$anchor, $$slotProps) => {
-				var fragment_7 = root_2();
-				var node_7 = $.first_child(fragment_7);
+				var fragment_9 = root();
+				var node_7 = $.first_child(fragment_9);
 				$.component(node_7, () => DatePicker.View, ($$anchor, ArkDatePicker_View) => {
 					ArkDatePicker_View($$anchor, {
 						view: "day",
 						children: ($$anchor, $$slotProps) => {
-							var fragment_8 = root_4();
-							var node_8 = $.first_child(fragment_8);
+							var fragment_10 = root_2();
+							var node_8 = $.first_child(fragment_10);
 							header(node_8);
 							var node_9 = $.sibling(node_8, 2);
 							{
 								const children = ($$anchor, dp = $.noop) => {
-									var fragment_9 = $.comment();
-									var node_10 = $.first_child(fragment_9);
+									var fragment_11 = $.comment();
+									var node_10 = $.first_child(fragment_11);
 									$.component(node_10, () => DatePicker.Table, ($$anchor, ArkDatePicker_Table) => {
 										ArkDatePicker_Table($$anchor, {
 											children: ($$anchor, $$slotProps) => {
-												var fragment_10 = root_4();
-												var node_11 = $.first_child(fragment_10);
+												var fragment_12 = root_2();
+												var node_11 = $.first_child(fragment_12);
 												$.component(node_11, () => DatePicker.TableHead, ($$anchor, ArkDatePicker_TableHead) => {
 													ArkDatePicker_TableHead($$anchor, {
 														children: ($$anchor, $$slotProps) => {
-															var fragment_11 = $.comment();
-															var node_12 = $.first_child(fragment_11);
+															var fragment_13 = $.comment();
+															var node_12 = $.first_child(fragment_13);
 															$.component(node_12, () => DatePicker.TableRow, ($$anchor, ArkDatePicker_TableRow) => {
 																ArkDatePicker_TableRow($$anchor, {
 																	children: ($$anchor, $$slotProps) => {
-																		var fragment_12 = $.comment();
-																		var node_13 = $.first_child(fragment_12);
+																		var fragment_14 = $.comment();
+																		var node_13 = $.first_child(fragment_14);
 																		$.each(node_13, 17, () => dp().weekDays, $.index, ($$anchor, day) => {
-																			var fragment_13 = $.comment();
-																			var node_14 = $.first_child(fragment_13);
+																			var fragment_15 = $.comment();
+																			var node_14 = $.first_child(fragment_15);
 																			$.component(node_14, () => DatePicker.TableHeader, ($$anchor, ArkDatePicker_TableHeader) => {
 																				ArkDatePicker_TableHeader($$anchor, {
 																					get "aria-label"() {
@@ -178,14 +176,14 @@ function Calendar$1($$anchor, $$props) {
 																					$$slots: { default: true }
 																				});
 																			});
-																			$.append($$anchor, fragment_13);
+																			$.append($$anchor, fragment_15);
 																		});
-																		$.append($$anchor, fragment_12);
+																		$.append($$anchor, fragment_14);
 																	},
 																	$$slots: { default: true }
 																});
 															});
-															$.append($$anchor, fragment_11);
+															$.append($$anchor, fragment_13);
 														},
 														$$slots: { default: true }
 													});
@@ -194,27 +192,27 @@ function Calendar$1($$anchor, $$props) {
 												$.component(node_15, () => DatePicker.TableBody, ($$anchor, ArkDatePicker_TableBody) => {
 													ArkDatePicker_TableBody($$anchor, {
 														children: ($$anchor, $$slotProps) => {
-															var fragment_15 = $.comment();
-															var node_16 = $.first_child(fragment_15);
+															var fragment_17 = $.comment();
+															var node_16 = $.first_child(fragment_17);
 															$.each(node_16, 17, () => dp().weeks, $.index, ($$anchor, week) => {
-																var fragment_16 = $.comment();
-																var node_17 = $.first_child(fragment_16);
+																var fragment_18 = $.comment();
+																var node_17 = $.first_child(fragment_18);
 																$.component(node_17, () => DatePicker.TableRow, ($$anchor, ArkDatePicker_TableRow_1) => {
 																	ArkDatePicker_TableRow_1($$anchor, {
 																		children: ($$anchor, $$slotProps) => {
-																			var fragment_17 = $.comment();
-																			var node_18 = $.first_child(fragment_17);
+																			var fragment_19 = $.comment();
+																			var node_18 = $.first_child(fragment_19);
 																			$.each(node_18, 17, () => $.get(week), $.index, ($$anchor, day) => {
-																				var fragment_18 = $.comment();
-																				var node_19 = $.first_child(fragment_18);
+																				var fragment_20 = $.comment();
+																				var node_19 = $.first_child(fragment_20);
 																				$.component(node_19, () => DatePicker.TableCell, ($$anchor, ArkDatePicker_TableCell) => {
 																					ArkDatePicker_TableCell($$anchor, {
 																						get value() {
 																							return $.get(day);
 																						},
 																						children: ($$anchor, $$slotProps) => {
-																							var fragment_19 = $.comment();
-																							var node_20 = $.first_child(fragment_19);
+																							var fragment_21 = $.comment();
+																							var node_20 = $.first_child(fragment_21);
 																							$.component(node_20, () => DatePicker.TableCellTrigger, ($$anchor, ArkDatePicker_TableCellTrigger) => {
 																								ArkDatePicker_TableCellTrigger($$anchor, {
 																									children: ($$anchor, $$slotProps) => {
@@ -226,31 +224,31 @@ function Calendar$1($$anchor, $$props) {
 																									$$slots: { default: true }
 																								});
 																							});
-																							$.append($$anchor, fragment_19);
+																							$.append($$anchor, fragment_21);
 																						},
 																						$$slots: { default: true }
 																					});
 																				});
-																				$.append($$anchor, fragment_18);
+																				$.append($$anchor, fragment_20);
 																			});
-																			$.append($$anchor, fragment_17);
+																			$.append($$anchor, fragment_19);
 																		},
 																		$$slots: { default: true }
 																	});
 																});
-																$.append($$anchor, fragment_16);
+																$.append($$anchor, fragment_18);
 															});
-															$.append($$anchor, fragment_15);
+															$.append($$anchor, fragment_17);
 														},
 														$$slots: { default: true }
 													});
 												});
-												$.append($$anchor, fragment_10);
+												$.append($$anchor, fragment_12);
 											},
 											$$slots: { default: true }
 										});
 									});
-									$.append($$anchor, fragment_9);
+									$.append($$anchor, fragment_11);
 								};
 								$.component(node_9, () => DatePicker.Context, ($$anchor, ArkDatePicker_Context_1) => {
 									ArkDatePicker_Context_1($$anchor, {
@@ -259,7 +257,7 @@ function Calendar$1($$anchor, $$props) {
 									});
 								});
 							}
-							$.append($$anchor, fragment_8);
+							$.append($$anchor, fragment_10);
 						},
 						$$slots: { default: true }
 					});
@@ -269,36 +267,36 @@ function Calendar$1($$anchor, $$props) {
 					ArkDatePicker_View_1($$anchor, {
 						view: "month",
 						children: ($$anchor, $$slotProps) => {
-							var fragment_21 = root_4();
-							var node_22 = $.first_child(fragment_21);
+							var fragment_23 = root_2();
+							var node_22 = $.first_child(fragment_23);
 							header(node_22);
 							var node_23 = $.sibling(node_22, 2);
 							{
 								const children = ($$anchor, dp = $.noop) => {
-									var fragment_22 = $.comment();
-									var node_24 = $.first_child(fragment_22);
+									var fragment_24 = $.comment();
+									var node_24 = $.first_child(fragment_24);
 									$.component(node_24, () => DatePicker.Table, ($$anchor, ArkDatePicker_Table_1) => {
 										ArkDatePicker_Table_1($$anchor, {
 											columns: 3,
 											children: ($$anchor, $$slotProps) => {
-												var fragment_23 = $.comment();
-												var node_25 = $.first_child(fragment_23);
+												var fragment_25 = $.comment();
+												var node_25 = $.first_child(fragment_25);
 												$.component(node_25, () => DatePicker.TableBody, ($$anchor, ArkDatePicker_TableBody_1) => {
 													ArkDatePicker_TableBody_1($$anchor, {
 														children: ($$anchor, $$slotProps) => {
-															var fragment_24 = $.comment();
-															var node_26 = $.first_child(fragment_24);
+															var fragment_26 = $.comment();
+															var node_26 = $.first_child(fragment_26);
 															$.each(node_26, 17, () => dp().getMonthsGrid({ columns: 3 }), $.index, ($$anchor, months) => {
-																var fragment_25 = $.comment();
-																var node_27 = $.first_child(fragment_25);
+																var fragment_27 = $.comment();
+																var node_27 = $.first_child(fragment_27);
 																$.component(node_27, () => DatePicker.TableRow, ($$anchor, ArkDatePicker_TableRow_2) => {
 																	ArkDatePicker_TableRow_2($$anchor, {
 																		children: ($$anchor, $$slotProps) => {
-																			var fragment_26 = $.comment();
-																			var node_28 = $.first_child(fragment_26);
+																			var fragment_28 = $.comment();
+																			var node_28 = $.first_child(fragment_28);
 																			$.each(node_28, 17, () => $.get(months), $.index, ($$anchor, month) => {
-																				var fragment_27 = $.comment();
-																				var node_29 = $.first_child(fragment_27);
+																				var fragment_29 = $.comment();
+																				var node_29 = $.first_child(fragment_29);
 																				$.component(node_29, () => DatePicker.TableCell, ($$anchor, ArkDatePicker_TableCell_1) => {
 																					ArkDatePicker_TableCell_1($$anchor, {
 																						get value() {
@@ -306,8 +304,8 @@ function Calendar$1($$anchor, $$props) {
 																						},
 																						columns: 3,
 																						children: ($$anchor, $$slotProps) => {
-																							var fragment_28 = $.comment();
-																							var node_30 = $.first_child(fragment_28);
+																							var fragment_30 = $.comment();
+																							var node_30 = $.first_child(fragment_30);
 																							$.component(node_30, () => DatePicker.TableCellTrigger, ($$anchor, ArkDatePicker_TableCellTrigger_1) => {
 																								ArkDatePicker_TableCellTrigger_1($$anchor, {
 																									children: ($$anchor, $$slotProps) => {
@@ -319,31 +317,31 @@ function Calendar$1($$anchor, $$props) {
 																									$$slots: { default: true }
 																								});
 																							});
-																							$.append($$anchor, fragment_28);
+																							$.append($$anchor, fragment_30);
 																						},
 																						$$slots: { default: true }
 																					});
 																				});
-																				$.append($$anchor, fragment_27);
+																				$.append($$anchor, fragment_29);
 																			});
-																			$.append($$anchor, fragment_26);
+																			$.append($$anchor, fragment_28);
 																		},
 																		$$slots: { default: true }
 																	});
 																});
-																$.append($$anchor, fragment_25);
+																$.append($$anchor, fragment_27);
 															});
-															$.append($$anchor, fragment_24);
+															$.append($$anchor, fragment_26);
 														},
 														$$slots: { default: true }
 													});
 												});
-												$.append($$anchor, fragment_23);
+												$.append($$anchor, fragment_25);
 											},
 											$$slots: { default: true }
 										});
 									});
-									$.append($$anchor, fragment_22);
+									$.append($$anchor, fragment_24);
 								};
 								$.component(node_23, () => DatePicker.Context, ($$anchor, ArkDatePicker_Context_2) => {
 									ArkDatePicker_Context_2($$anchor, {
@@ -352,7 +350,7 @@ function Calendar$1($$anchor, $$props) {
 									});
 								});
 							}
-							$.append($$anchor, fragment_21);
+							$.append($$anchor, fragment_23);
 						},
 						$$slots: { default: true }
 					});
@@ -362,36 +360,36 @@ function Calendar$1($$anchor, $$props) {
 					ArkDatePicker_View_2($$anchor, {
 						view: "year",
 						children: ($$anchor, $$slotProps) => {
-							var fragment_30 = root_4();
-							var node_32 = $.first_child(fragment_30);
+							var fragment_32 = root_2();
+							var node_32 = $.first_child(fragment_32);
 							header(node_32);
 							var node_33 = $.sibling(node_32, 2);
 							{
 								const children = ($$anchor, dp = $.noop) => {
-									var fragment_31 = $.comment();
-									var node_34 = $.first_child(fragment_31);
+									var fragment_33 = $.comment();
+									var node_34 = $.first_child(fragment_33);
 									$.component(node_34, () => DatePicker.Table, ($$anchor, ArkDatePicker_Table_2) => {
 										ArkDatePicker_Table_2($$anchor, {
 											columns: 3,
 											children: ($$anchor, $$slotProps) => {
-												var fragment_32 = $.comment();
-												var node_35 = $.first_child(fragment_32);
+												var fragment_34 = $.comment();
+												var node_35 = $.first_child(fragment_34);
 												$.component(node_35, () => DatePicker.TableBody, ($$anchor, ArkDatePicker_TableBody_2) => {
 													ArkDatePicker_TableBody_2($$anchor, {
 														children: ($$anchor, $$slotProps) => {
-															var fragment_33 = $.comment();
-															var node_36 = $.first_child(fragment_33);
+															var fragment_35 = $.comment();
+															var node_36 = $.first_child(fragment_35);
 															$.each(node_36, 17, () => dp().getYearsGrid({ columns: 3 }), $.index, ($$anchor, years) => {
-																var fragment_34 = $.comment();
-																var node_37 = $.first_child(fragment_34);
+																var fragment_36 = $.comment();
+																var node_37 = $.first_child(fragment_36);
 																$.component(node_37, () => DatePicker.TableRow, ($$anchor, ArkDatePicker_TableRow_3) => {
 																	ArkDatePicker_TableRow_3($$anchor, {
 																		children: ($$anchor, $$slotProps) => {
-																			var fragment_35 = $.comment();
-																			var node_38 = $.first_child(fragment_35);
+																			var fragment_37 = $.comment();
+																			var node_38 = $.first_child(fragment_37);
 																			$.each(node_38, 17, () => $.get(years), $.index, ($$anchor, year) => {
-																				var fragment_36 = $.comment();
-																				var node_39 = $.first_child(fragment_36);
+																				var fragment_38 = $.comment();
+																				var node_39 = $.first_child(fragment_38);
 																				$.component(node_39, () => DatePicker.TableCell, ($$anchor, ArkDatePicker_TableCell_2) => {
 																					ArkDatePicker_TableCell_2($$anchor, {
 																						get value() {
@@ -399,8 +397,8 @@ function Calendar$1($$anchor, $$props) {
 																						},
 																						columns: 3,
 																						children: ($$anchor, $$slotProps) => {
-																							var fragment_37 = $.comment();
-																							var node_40 = $.first_child(fragment_37);
+																							var fragment_39 = $.comment();
+																							var node_40 = $.first_child(fragment_39);
 																							$.component(node_40, () => DatePicker.TableCellTrigger, ($$anchor, ArkDatePicker_TableCellTrigger_2) => {
 																								ArkDatePicker_TableCellTrigger_2($$anchor, {
 																									children: ($$anchor, $$slotProps) => {
@@ -412,31 +410,31 @@ function Calendar$1($$anchor, $$props) {
 																									$$slots: { default: true }
 																								});
 																							});
-																							$.append($$anchor, fragment_37);
+																							$.append($$anchor, fragment_39);
 																						},
 																						$$slots: { default: true }
 																					});
 																				});
-																				$.append($$anchor, fragment_36);
+																				$.append($$anchor, fragment_38);
 																			});
-																			$.append($$anchor, fragment_35);
+																			$.append($$anchor, fragment_37);
 																		},
 																		$$slots: { default: true }
 																	});
 																});
-																$.append($$anchor, fragment_34);
+																$.append($$anchor, fragment_36);
 															});
-															$.append($$anchor, fragment_33);
+															$.append($$anchor, fragment_35);
 														},
 														$$slots: { default: true }
 													});
 												});
-												$.append($$anchor, fragment_32);
+												$.append($$anchor, fragment_34);
 											},
 											$$slots: { default: true }
 										});
 									});
-									$.append($$anchor, fragment_31);
+									$.append($$anchor, fragment_33);
 								};
 								$.component(node_33, () => DatePicker.Context, ($$anchor, ArkDatePicker_Context_3) => {
 									ArkDatePicker_Context_3($$anchor, {
@@ -445,12 +443,12 @@ function Calendar$1($$anchor, $$props) {
 									});
 								});
 							}
-							$.append($$anchor, fragment_30);
+							$.append($$anchor, fragment_32);
 						},
 						$$slots: { default: true }
 					});
 				});
-				$.append($$anchor, fragment_7);
+				$.append($$anchor, fragment_9);
 			},
 			$$slots: { default: true }
 		});
@@ -465,7 +463,7 @@ function Calendar$1($$anchor, $$props) {
 //#region src/components/calendar/index.ts
 /** The date-picker's month grid, standing on the page without its
 * popup: always open, the trigger gone, the vessel a quiet card. */
-const Calendar = Calendar$1;
+const Calendar = withSelfRoot(Calendar$1);
 injectComponentStyle("date-picker");
 //#endregion
 export { Calendar as t };

package/dist/{cascade-select-CfvWchiN.mjs → cascade-select-CKStvgjR.mjs}

@@ -1,3 +1,5 @@
+import { n as withSelfRoot } from "./family-CzLaku1F.mjs";
+import { t as InternalIcon } from "./InternalIcon-Clwbj4MY.mjs";
 import { n as useComponentMessages } from "./messages-DNzA55pH.mjs";
 import { t as Input } from "./Input-CZhcEeFU.mjs";
 import { injectComponentStyle } from "@bysages/core";
@@ -22,14 +24,14 @@ var rest_excludes = /* @__PURE__ */ new Set([
 	"multiple",
 	"disabled"
 ]);
-var root = $.from_html(`<span data-scope="cascade-select" data-part="branch-indicator" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m9 18 6-6-6-6"></path></svg></span>`);
-var root_1 = $.from_html(`<li><span> </span> <!> <span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m5 12.5 5 5L19 7"></path></svg></span></li>`);
+var root = $.from_html(`<span data-scope="cascade-select" data-part="branch-indicator" aria-hidden="true"><!></span>`);
+var root_1 = $.from_html(`<li><span> </span> <!> <span><!></span></li>`);
 var root_2 = $.from_html(`<ul></ul> <!>`, 1);
 var root_3 = $.from_html(`<div data-scope="cascade-select" data-part="search"><!></div>`);
 var root_4 = $.from_html(`<p data-scope="cascade-select" data-part="empty">Nothing matches</p>`);
 var root_5 = $.from_html(`<button type="button" data-scope="cascade-select" data-part="match"> </button>`);
 var root_6 = $.from_html(`<div><div><!> <div data-scope="cascade-select" data-part="corridor"><!></div></div></div>`);
-var root_7 = $.from_html(`<div><div><button><span> </span> <span><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div> <!></div>`);
+var root_7 = $.from_html(`<div><div><button><span> </span> <span><!></span></button></div> <!></div>`);
 function CascadeSelect$1($$anchor, $$props) {
 	const id = $.props_id();
 	$.push($$props, true);
@@ -63,6 +65,9 @@ function CascadeSelect$1($$anchor, $$props) {
 			var node_1 = $.sibling(span, 2);
 			var consequent = ($$anchor) => {
 				var span_1 = root();
+				var node_2 = $.child(span_1);
+				InternalIcon(node_2, { name: "chevron-right" });
+				$.reset(span_1);
 				$.append($$anchor, span_1);
 			};
 			$.if(node_1, ($$render) => {
@@ -70,12 +75,15 @@ function CascadeSelect$1($$anchor, $$props) {
 			});
 			var span_2 = $.sibling(node_1, 2);
 			$.attribute_effect(span_2, ($0) => ({ ...$0 }), [() => $.get(api).getItemIndicatorProps($.get(itemProps))]);
+			var node_3 = $.child(span_2);
+			InternalIcon(node_3, { name: "check" });
+			$.reset(span_2);
 			$.reset(li);
 			$.template_effect(() => $.set_text(text, $.get(item).label));
 			$.append($$anchor, li);
 		});
 		$.reset(ul);
-		var node_2 = $.sibling(ul, 2);
+		var node_4 = $.sibling(ul, 2);
 		var consequent_1 = ($$anchor) => {
 			{
 				let $0 = $.derived(() => [...indexPath(), $.get(nodeState).highlightedIndex]);
@@ -84,7 +92,7 @@ function CascadeSelect$1($$anchor, $$props) {
 			}
 		};
 		var d = $.derived(() => $.get(nodeState).highlightedChild != null && $.get(collection).isBranchNode($.get(nodeState).highlightedChild));
-		$.if(node_2, ($$render) => {
+		$.if(node_4, ($$render) => {
 			if ($.get(d)) $$render(consequent_1);
 		});
 		$.append($$anchor, fragment);
@@ -199,10 +207,13 @@ function CascadeSelect$1($$anchor, $$props) {
 	var text_1 = $.only_child(span_3, true);
 	var span_4 = $.sibling(span_3, 2);
 	$.attribute_effect(span_4, ($0) => ({ ...$0 }), [() => $.get(api).getIndicatorProps()]);
+	var node_5 = $.child(span_4);
+	InternalIcon(node_5, { name: "chevron-down" });
+	$.reset(span_4);
 	$.reset(button);
 	$.reset(div_1);
-	var node_3 = $.sibling(div_1, 2);
-	Portal(node_3, {
+	var node_6 = $.sibling(div_1, 2);
+	Portal(node_6, {
 		children: ($$anchor, $$slotProps) => {
 			var div_2 = root_6();
 			$.attribute_effect(div_2, ($0) => ({ ...$0 }), [() => $.get(api).getPositionerProps()]);
@@ -211,14 +222,14 @@ function CascadeSelect$1($$anchor, $$props) {
 				...$0,
 				"data-size": size()
 			}), [() => $.get(api).getContentProps()]);
-			var node_4 = $.child(div_3);
+			var node_7 = $.child(div_3);
 			var consequent_2 = ($$anchor) => {
 				var div_4 = root_3();
-				var node_5 = $.child(div_4);
+				var node_8 = $.child(div_4);
 				{
 					let $0 = $.derived(() => messages().select.filter);
 					let $1 = $.derived(() => messages().select.filter);
-					Input(node_5, {
+					Input(node_8, {
 						size: "sm",
 						get placeholder() {
 							return $.get($0);
@@ -237,22 +248,22 @@ function CascadeSelect$1($$anchor, $$props) {
 				$.reset(div_4);
 				$.append($$anchor, div_4);
 			};
-			$.if(node_4, ($$render) => {
+			$.if(node_7, ($$render) => {
 				if (filterable()) $$render(consequent_2);
 			});
-			var div_5 = $.sibling(node_4, 2);
-			var node_6 = $.child(div_5);
+			var div_5 = $.sibling(node_7, 2);
+			var node_9 = $.child(div_5);
 			var consequent_4 = ($$anchor) => {
 				var fragment_2 = $.comment();
-				var node_7 = $.first_child(fragment_2);
+				var node_10 = $.first_child(fragment_2);
 				var consequent_3 = ($$anchor) => {
 					var p_1 = root_4();
 					$.append($$anchor, p_1);
 				};
 				var alternate = ($$anchor) => {
 					var fragment_3 = $.comment();
-					var node_8 = $.first_child(fragment_3);
-					$.each(node_8, 17, () => $.get(matchPaths), (hit) => hit.path.join("/"), ($$anchor, hit) => {
+					var node_11 = $.first_child(fragment_3);
+					$.each(node_11, 17, () => $.get(matchPaths), (hit) => hit.path.join("/"), ($$anchor, hit) => {
 						var button_1 = root_5();
 						var text_2 = $.only_child(button_1, true);
 						$.template_effect(($0, $1) => {
@@ -264,7 +275,7 @@ function CascadeSelect$1($$anchor, $$props) {
 					});
 					$.append($$anchor, fragment_3);
 				};
-				$.if(node_7, ($$render) => {
+				$.if(node_10, ($$render) => {
 					if ($.get(matchPaths).length === 0) $$render(consequent_3);
 					else $$render(alternate, -1);
 				});
@@ -273,7 +284,7 @@ function CascadeSelect$1($$anchor, $$props) {
 			var alternate_1 = ($$anchor) => {
 				column($$anchor, () => $.get(collection).rootNode, () => [], () => []);
 			};
-			$.if(node_6, ($$render) => {
+			$.if(node_9, ($$render) => {
 				if ($.get(filtering)) $$render(consequent_4);
 				else $$render(alternate_1, -1);
 			});
@@ -296,6 +307,6 @@ $.delegate(["click"]);
 /** A corridor of linked columns: pick a branch and the next column
 * dissolves open beside it, until a leaf click settles the whole
 * path. */
-const CascadeSelect = CascadeSelect$1;
+const CascadeSelect = withSelfRoot(CascadeSelect$1);
 //#endregion
 export { CascadeSelect as t };