cognova 0.2.19 → 0.2.21

package/.output/server/chunks/build/Tree-DUhXKd8y.mjs

@@ -50,10 +50,7 @@ const _sfc_main$2 = {
     const [DefineItemTemplate, ReuseItemTemplate] = createReusableTemplate();
     const childrenIcon = computed(() => dir.value === "rtl" ? appConfig.ui.icons.chevronLeft : appConfig.ui.icons.chevronRight);
     const groups = computed(
-      () => {
-        var _a;
-        return ((_a = props.items) == null ? void 0 : _a.length) ? isArrayOfArray(props.items) ? props.items : [props.items] : [];
-      }
+      () => props.items?.length ? isArrayOfArray(props.items) ? props.items : [props.items] : []
     );
     return (_ctx, _push, _parent, _attrs) => {
       _push(`<!--[-->`);
@@ -65,39 +62,37 @@ const _sfc_main$2 = {
               index,
               ui: __props.ui
             }, () => {
-              var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
               ssrRenderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", {
                 item,
                 active,
                 index,
                 ui: __props.ui
               }, () => {
-                var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2;
                 if (item.loading) {
                   _push2(ssrRenderComponent(_sfc_main$d, {
                     name: __props.loadingIcon || unref(appConfig).ui.icons.loading,
                     "data-slot": "itemLeadingIcon",
-                    class: __props.ui.itemLeadingIcon({ class: [(_a2 = __props.uiOverride) == null ? void 0 : _a2.itemLeadingIcon, (_b2 = item.ui) == null ? void 0 : _b2.itemLeadingIcon], color: item == null ? void 0 : item.color, loading: true })
+                    class: __props.ui.itemLeadingIcon({ class: [__props.uiOverride?.itemLeadingIcon, item.ui?.itemLeadingIcon], color: item?.color, loading: true })
                   }, null, _parent2, _scopeId));
                 } else if (item.icon) {
                   _push2(ssrRenderComponent(_sfc_main$d, {
                     name: item.icon,
                     "data-slot": "itemLeadingIcon",
-                    class: __props.ui.itemLeadingIcon({ class: [(_c2 = __props.uiOverride) == null ? void 0 : _c2.itemLeadingIcon, (_d2 = item.ui) == null ? void 0 : _d2.itemLeadingIcon], color: item == null ? void 0 : item.color, active })
+                    class: __props.ui.itemLeadingIcon({ class: [__props.uiOverride?.itemLeadingIcon, item.ui?.itemLeadingIcon], color: item?.color, active })
                   }, null, _parent2, _scopeId));
                 } else if (item.avatar) {
                   _push2(ssrRenderComponent(_sfc_main$b, mergeProps({
-                    size: ((_e2 = item.ui) == null ? void 0 : _e2.itemLeadingAvatarSize) || ((_f2 = __props.uiOverride) == null ? void 0 : _f2.itemLeadingAvatarSize) || __props.ui.itemLeadingAvatarSize()
+                    size: item.ui?.itemLeadingAvatarSize || __props.uiOverride?.itemLeadingAvatarSize || __props.ui.itemLeadingAvatarSize()
                   }, item.avatar, {
                     "data-slot": "itemLeadingAvatar",
-                    class: __props.ui.itemLeadingAvatar({ class: [(_g2 = __props.uiOverride) == null ? void 0 : _g2.itemLeadingAvatar, (_h2 = item.ui) == null ? void 0 : _h2.itemLeadingAvatar], active })
+                    class: __props.ui.itemLeadingAvatar({ class: [__props.uiOverride?.itemLeadingAvatar, item.ui?.itemLeadingAvatar], active })
                   }), null, _parent2, _scopeId));
                 } else {
                   _push2(`<!---->`);
                 }
               }, _push2, _parent2, _scopeId);
               if (unref(get)(item, props.labelKey) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] || (unref(get)(item, props.descriptionKey) || !!slots[item.slot ? `${item.slot}-description` : "item-description"])) {
-                _push2(`<span data-slot="itemWrapper" class="${ssrRenderClass(__props.ui.itemWrapper({ class: [(_a = __props.uiOverride) == null ? void 0 : _a.itemWrapper, (_b = item.ui) == null ? void 0 : _b.itemWrapper] }))}"${_scopeId}><span data-slot="itemLabel" class="${ssrRenderClass(__props.ui.itemLabel({ class: [(_c = __props.uiOverride) == null ? void 0 : _c.itemLabel, (_d = item.ui) == null ? void 0 : _d.itemLabel], active }))}"${_scopeId}>`);
+                _push2(`<span data-slot="itemWrapper" class="${ssrRenderClass(__props.ui.itemWrapper({ class: [__props.uiOverride?.itemWrapper, item.ui?.itemWrapper] }))}"${_scopeId}><span data-slot="itemLabel" class="${ssrRenderClass(__props.ui.itemLabel({ class: [__props.uiOverride?.itemLabel, item.ui?.itemLabel], active }))}"${_scopeId}>`);
                 ssrRenderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", {
                   item,
                   active,
@@ -109,14 +104,14 @@ const _sfc_main$2 = {
                   _push2(ssrRenderComponent(_sfc_main$d, {
                     name: typeof __props.externalIcon === "string" ? __props.externalIcon : unref(appConfig).ui.icons.external,
                     "data-slot": "itemLabelExternalIcon",
-                    class: __props.ui.itemLabelExternalIcon({ class: [(_e = __props.uiOverride) == null ? void 0 : _e.itemLabelExternalIcon, (_f = item.ui) == null ? void 0 : _f.itemLabelExternalIcon], color: item == null ? void 0 : item.color, active })
+                    class: __props.ui.itemLabelExternalIcon({ class: [__props.uiOverride?.itemLabelExternalIcon, item.ui?.itemLabelExternalIcon], color: item?.color, active })
                   }, null, _parent2, _scopeId));
                 } else {
                   _push2(`<!---->`);
                 }
                 _push2(`</span>`);
                 if (unref(get)(item, props.descriptionKey)) {
-                  _push2(`<span data-slot="itemDescription" class="${ssrRenderClass(__props.ui.itemDescription({ class: [(_g = __props.uiOverride) == null ? void 0 : _g.itemDescription, (_h = item.ui) == null ? void 0 : _h.itemDescription] }))}"${_scopeId}>`);
+                  _push2(`<span data-slot="itemDescription" class="${ssrRenderClass(__props.ui.itemDescription({ class: [__props.uiOverride?.itemDescription, item.ui?.itemDescription] }))}"${_scopeId}>`);
                   ssrRenderSlot(_ctx.$slots, item.slot ? `${item.slot}-description` : "item-description", {
                     item,
                     active,
@@ -132,27 +127,25 @@ const _sfc_main$2 = {
               } else {
                 _push2(`<!---->`);
               }
-              _push2(`<span data-slot="itemTrailing" class="${ssrRenderClass(__props.ui.itemTrailing({ class: [(_i = __props.uiOverride) == null ? void 0 : _i.itemTrailing, (_j = item.ui) == null ? void 0 : _j.itemTrailing] }))}"${_scopeId}>`);
+              _push2(`<span data-slot="itemTrailing" class="${ssrRenderClass(__props.ui.itemTrailing({ class: [__props.uiOverride?.itemTrailing, item.ui?.itemTrailing] }))}"${_scopeId}>`);
               ssrRenderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", {
                 item,
                 active,
                 index,
                 ui: __props.ui
               }, () => {
-                var _a2, _b2, _c2, _d2, _e2, _f2;
-                if ((_a2 = item.children) == null ? void 0 : _a2.length) {
+                if (item.children?.length) {
                   _push2(ssrRenderComponent(_sfc_main$d, {
                     name: childrenIcon.value,
                     "data-slot": "itemTrailingIcon",
-                    class: __props.ui.itemTrailingIcon({ class: [(_b2 = __props.uiOverride) == null ? void 0 : _b2.itemTrailingIcon, (_c2 = item.ui) == null ? void 0 : _c2.itemTrailingIcon], color: item == null ? void 0 : item.color, active })
+                    class: __props.ui.itemTrailingIcon({ class: [__props.uiOverride?.itemTrailingIcon, item.ui?.itemTrailingIcon], color: item?.color, active })
                   }, null, _parent2, _scopeId));
-                } else if ((_d2 = item.kbds) == null ? void 0 : _d2.length) {
-                  _push2(`<span data-slot="itemTrailingKbds" class="${ssrRenderClass(__props.ui.itemTrailingKbds({ class: [(_e2 = __props.uiOverride) == null ? void 0 : _e2.itemTrailingKbds, (_f2 = item.ui) == null ? void 0 : _f2.itemTrailingKbds] }))}"${_scopeId}><!--[-->`);
+                } else if (item.kbds?.length) {
+                  _push2(`<span data-slot="itemTrailingKbds" class="${ssrRenderClass(__props.ui.itemTrailingKbds({ class: [__props.uiOverride?.itemTrailingKbds, item.ui?.itemTrailingKbds] }))}"${_scopeId}><!--[-->`);
                   ssrRenderList(item.kbds, (kbd, kbdIndex) => {
-                    var _a3, _b3;
                     _push2(ssrRenderComponent(_sfc_main$3, mergeProps({
                       key: kbdIndex,
-                      size: ((_a3 = item.ui) == null ? void 0 : _a3.itemTrailingKbdsSize) || ((_b3 = __props.uiOverride) == null ? void 0 : _b3.itemTrailingKbdsSize) || __props.ui.itemTrailingKbdsSize()
+                      size: item.ui?.itemTrailingKbdsSize || __props.uiOverride?.itemTrailingKbdsSize || __props.ui.itemTrailingKbdsSize()
                     }, { ref_for: true }, typeof kbd === "string" ? { value: kbd } : kbd), null, _parent2, _scopeId));
                   });
                   _push2(`<!--]--></span>`);
@@ -162,19 +155,18 @@ const _sfc_main$2 = {
               }, _push2, _parent2, _scopeId);
               _push2(ssrRenderComponent(unref(ContextMenu).ItemIndicator, { "as-child": "" }, {
                 default: withCtx((_, _push3, _parent3, _scopeId2) => {
-                  var _a2, _b2, _c2, _d2;
                   if (_push3) {
                     _push3(ssrRenderComponent(_sfc_main$d, {
                       name: __props.checkedIcon || unref(appConfig).ui.icons.check,
                       "data-slot": "itemTrailingIcon",
-                      class: __props.ui.itemTrailingIcon({ class: [(_a2 = __props.uiOverride) == null ? void 0 : _a2.itemTrailingIcon, (_b2 = item.ui) == null ? void 0 : _b2.itemTrailingIcon], color: item == null ? void 0 : item.color })
+                      class: __props.ui.itemTrailingIcon({ class: [__props.uiOverride?.itemTrailingIcon, item.ui?.itemTrailingIcon], color: item?.color })
                     }, null, _parent3, _scopeId2));
                   } else {
                     return [
                       createVNode(_sfc_main$d, {
                         name: __props.checkedIcon || unref(appConfig).ui.icons.check,
                         "data-slot": "itemTrailingIcon",
-                        class: __props.ui.itemTrailingIcon({ class: [(_c2 = __props.uiOverride) == null ? void 0 : _c2.itemTrailingIcon, (_d2 = item.ui) == null ? void 0 : _d2.itemTrailingIcon], color: item == null ? void 0 : item.color })
+                        class: __props.ui.itemTrailingIcon({ class: [__props.uiOverride?.itemTrailingIcon, item.ui?.itemTrailingIcon], color: item?.color })
                       }, null, 8, ["name", "class"])
                     ];
                   }
@@ -189,121 +181,108 @@ const _sfc_main$2 = {
                 item,
                 index,
                 ui: __props.ui
-              }, () => {
-                var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
-                return [
-                  renderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", {
+              }, () => [
+                renderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", {
+                  item,
+                  active,
+                  index,
+                  ui: __props.ui
+                }, () => [
+                  item.loading ? (openBlock(), createBlock(_sfc_main$d, {
+                    key: 0,
+                    name: __props.loadingIcon || unref(appConfig).ui.icons.loading,
+                    "data-slot": "itemLeadingIcon",
+                    class: __props.ui.itemLeadingIcon({ class: [__props.uiOverride?.itemLeadingIcon, item.ui?.itemLeadingIcon], color: item?.color, loading: true })
+                  }, null, 8, ["name", "class"])) : item.icon ? (openBlock(), createBlock(_sfc_main$d, {
+                    key: 1,
+                    name: item.icon,
+                    "data-slot": "itemLeadingIcon",
+                    class: __props.ui.itemLeadingIcon({ class: [__props.uiOverride?.itemLeadingIcon, item.ui?.itemLeadingIcon], color: item?.color, active })
+                  }, null, 8, ["name", "class"])) : item.avatar ? (openBlock(), createBlock(_sfc_main$b, mergeProps({
+                    key: 2,
+                    size: item.ui?.itemLeadingAvatarSize || __props.uiOverride?.itemLeadingAvatarSize || __props.ui.itemLeadingAvatarSize()
+                  }, item.avatar, {
+                    "data-slot": "itemLeadingAvatar",
+                    class: __props.ui.itemLeadingAvatar({ class: [__props.uiOverride?.itemLeadingAvatar, item.ui?.itemLeadingAvatar], active })
+                  }), null, 16, ["size", "class"])) : createCommentVNode("", true)
+                ]),
+                unref(get)(item, props.labelKey) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] || (unref(get)(item, props.descriptionKey) || !!slots[item.slot ? `${item.slot}-description` : "item-description"]) ? (openBlock(), createBlock("span", {
+                  key: 0,
+                  "data-slot": "itemWrapper",
+                  class: __props.ui.itemWrapper({ class: [__props.uiOverride?.itemWrapper, item.ui?.itemWrapper] })
+                }, [
+                  createVNode("span", {
+                    "data-slot": "itemLabel",
+                    class: __props.ui.itemLabel({ class: [__props.uiOverride?.itemLabel, item.ui?.itemLabel], active })
+                  }, [
+                    renderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", {
+                      item,
+                      active,
+                      index
+                    }, () => [
+                      createTextVNode(toDisplayString(unref(get)(item, props.labelKey)), 1)
+                    ]),
+                    item.target === "_blank" && __props.externalIcon !== false ? (openBlock(), createBlock(_sfc_main$d, {
+                      key: 0,
+                      name: typeof __props.externalIcon === "string" ? __props.externalIcon : unref(appConfig).ui.icons.external,
+                      "data-slot": "itemLabelExternalIcon",
+                      class: __props.ui.itemLabelExternalIcon({ class: [__props.uiOverride?.itemLabelExternalIcon, item.ui?.itemLabelExternalIcon], color: item?.color, active })
+                    }, null, 8, ["name", "class"])) : createCommentVNode("", true)
+                  ], 2),
+                  unref(get)(item, props.descriptionKey) ? (openBlock(), createBlock("span", {
+                    key: 0,
+                    "data-slot": "itemDescription",
+                    class: __props.ui.itemDescription({ class: [__props.uiOverride?.itemDescription, item.ui?.itemDescription] })
+                  }, [
+                    renderSlot(_ctx.$slots, item.slot ? `${item.slot}-description` : "item-description", {
+                      item,
+                      active,
+                      index
+                    }, () => [
+                      createTextVNode(toDisplayString(unref(get)(item, props.descriptionKey)), 1)
+                    ])
+                  ], 2)) : createCommentVNode("", true)
+                ], 2)) : createCommentVNode("", true),
+                createVNode("span", {
+                  "data-slot": "itemTrailing",
+                  class: __props.ui.itemTrailing({ class: [__props.uiOverride?.itemTrailing, item.ui?.itemTrailing] })
+                }, [
+                  renderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", {
                     item,
                     active,
                     index,
                     ui: __props.ui
-                  }, () => {
-                    var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2;
-                    return [
-                      item.loading ? (openBlock(), createBlock(_sfc_main$d, {
-                        key: 0,
-                        name: __props.loadingIcon || unref(appConfig).ui.icons.loading,
-                        "data-slot": "itemLeadingIcon",
-                        class: __props.ui.itemLeadingIcon({ class: [(_a2 = __props.uiOverride) == null ? void 0 : _a2.itemLeadingIcon, (_b2 = item.ui) == null ? void 0 : _b2.itemLeadingIcon], color: item == null ? void 0 : item.color, loading: true })
-                      }, null, 8, ["name", "class"])) : item.icon ? (openBlock(), createBlock(_sfc_main$d, {
-                        key: 1,
-                        name: item.icon,
-                        "data-slot": "itemLeadingIcon",
-                        class: __props.ui.itemLeadingIcon({ class: [(_c2 = __props.uiOverride) == null ? void 0 : _c2.itemLeadingIcon, (_d2 = item.ui) == null ? void 0 : _d2.itemLeadingIcon], color: item == null ? void 0 : item.color, active })
-                      }, null, 8, ["name", "class"])) : item.avatar ? (openBlock(), createBlock(_sfc_main$b, mergeProps({
-                        key: 2,
-                        size: ((_e2 = item.ui) == null ? void 0 : _e2.itemLeadingAvatarSize) || ((_f2 = __props.uiOverride) == null ? void 0 : _f2.itemLeadingAvatarSize) || __props.ui.itemLeadingAvatarSize()
-                      }, item.avatar, {
-                        "data-slot": "itemLeadingAvatar",
-                        class: __props.ui.itemLeadingAvatar({ class: [(_g2 = __props.uiOverride) == null ? void 0 : _g2.itemLeadingAvatar, (_h2 = item.ui) == null ? void 0 : _h2.itemLeadingAvatar], active })
-                      }), null, 16, ["size", "class"])) : createCommentVNode("", true)
-                    ];
-                  }),
-                  unref(get)(item, props.labelKey) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] || (unref(get)(item, props.descriptionKey) || !!slots[item.slot ? `${item.slot}-description` : "item-description"]) ? (openBlock(), createBlock("span", {
-                    key: 0,
-                    "data-slot": "itemWrapper",
-                    class: __props.ui.itemWrapper({ class: [(_a = __props.uiOverride) == null ? void 0 : _a.itemWrapper, (_b = item.ui) == null ? void 0 : _b.itemWrapper] })
-                  }, [
-                    createVNode("span", {
-                      "data-slot": "itemLabel",
-                      class: __props.ui.itemLabel({ class: [(_c = __props.uiOverride) == null ? void 0 : _c.itemLabel, (_d = item.ui) == null ? void 0 : _d.itemLabel], active })
-                    }, [
-                      renderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", {
-                        item,
-                        active,
-                        index
-                      }, () => [
-                        createTextVNode(toDisplayString(unref(get)(item, props.labelKey)), 1)
-                      ]),
-                      item.target === "_blank" && __props.externalIcon !== false ? (openBlock(), createBlock(_sfc_main$d, {
-                        key: 0,
-                        name: typeof __props.externalIcon === "string" ? __props.externalIcon : unref(appConfig).ui.icons.external,
-                        "data-slot": "itemLabelExternalIcon",
-                        class: __props.ui.itemLabelExternalIcon({ class: [(_e = __props.uiOverride) == null ? void 0 : _e.itemLabelExternalIcon, (_f = item.ui) == null ? void 0 : _f.itemLabelExternalIcon], color: item == null ? void 0 : item.color, active })
-                      }, null, 8, ["name", "class"])) : createCommentVNode("", true)
-                    ], 2),
-                    unref(get)(item, props.descriptionKey) ? (openBlock(), createBlock("span", {
+                  }, () => [
+                    item.children?.length ? (openBlock(), createBlock(_sfc_main$d, {
                       key: 0,
-                      "data-slot": "itemDescription",
-                      class: __props.ui.itemDescription({ class: [(_g = __props.uiOverride) == null ? void 0 : _g.itemDescription, (_h = item.ui) == null ? void 0 : _h.itemDescription] })
+                      name: childrenIcon.value,
+                      "data-slot": "itemTrailingIcon",
+                      class: __props.ui.itemTrailingIcon({ class: [__props.uiOverride?.itemTrailingIcon, item.ui?.itemTrailingIcon], color: item?.color, active })
+                    }, null, 8, ["name", "class"])) : item.kbds?.length ? (openBlock(), createBlock("span", {
+                      key: 1,
+                      "data-slot": "itemTrailingKbds",
+                      class: __props.ui.itemTrailingKbds({ class: [__props.uiOverride?.itemTrailingKbds, item.ui?.itemTrailingKbds] })
                     }, [
-                      renderSlot(_ctx.$slots, item.slot ? `${item.slot}-description` : "item-description", {
-                        item,
-                        active,
-                        index
-                      }, () => [
-                        createTextVNode(toDisplayString(unref(get)(item, props.descriptionKey)), 1)
-                      ])
+                      (openBlock(true), createBlock(Fragment, null, renderList(item.kbds, (kbd, kbdIndex) => {
+                        return openBlock(), createBlock(_sfc_main$3, mergeProps({
+                          key: kbdIndex,
+                          size: item.ui?.itemTrailingKbdsSize || __props.uiOverride?.itemTrailingKbdsSize || __props.ui.itemTrailingKbdsSize()
+                        }, { ref_for: true }, typeof kbd === "string" ? { value: kbd } : kbd), null, 16, ["size"]);
+                      }), 128))
                     ], 2)) : createCommentVNode("", true)
-                  ], 2)) : createCommentVNode("", true),
-                  createVNode("span", {
-                    "data-slot": "itemTrailing",
-                    class: __props.ui.itemTrailing({ class: [(_i = __props.uiOverride) == null ? void 0 : _i.itemTrailing, (_j = item.ui) == null ? void 0 : _j.itemTrailing] })
-                  }, [
-                    renderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", {
-                      item,
-                      active,
-                      index,
-                      ui: __props.ui
-                    }, () => {
-                      var _a2, _b2, _c2, _d2, _e2, _f2;
-                      return [
-                        ((_a2 = item.children) == null ? void 0 : _a2.length) ? (openBlock(), createBlock(_sfc_main$d, {
-                          key: 0,
-                          name: childrenIcon.value,
-                          "data-slot": "itemTrailingIcon",
-                          class: __props.ui.itemTrailingIcon({ class: [(_b2 = __props.uiOverride) == null ? void 0 : _b2.itemTrailingIcon, (_c2 = item.ui) == null ? void 0 : _c2.itemTrailingIcon], color: item == null ? void 0 : item.color, active })
-                        }, null, 8, ["name", "class"])) : ((_d2 = item.kbds) == null ? void 0 : _d2.length) ? (openBlock(), createBlock("span", {
-                          key: 1,
-                          "data-slot": "itemTrailingKbds",
-                          class: __props.ui.itemTrailingKbds({ class: [(_e2 = __props.uiOverride) == null ? void 0 : _e2.itemTrailingKbds, (_f2 = item.ui) == null ? void 0 : _f2.itemTrailingKbds] })
-                        }, [
-                          (openBlock(true), createBlock(Fragment, null, renderList(item.kbds, (kbd, kbdIndex) => {
-                            var _a3, _b3;
-                            return openBlock(), createBlock(_sfc_main$3, mergeProps({
-                              key: kbdIndex,
-                              size: ((_a3 = item.ui) == null ? void 0 : _a3.itemTrailingKbdsSize) || ((_b3 = __props.uiOverride) == null ? void 0 : _b3.itemTrailingKbdsSize) || __props.ui.itemTrailingKbdsSize()
-                            }, { ref_for: true }, typeof kbd === "string" ? { value: kbd } : kbd), null, 16, ["size"]);
-                          }), 128))
-                        ], 2)) : createCommentVNode("", true)
-                      ];
-                    }),
-                    createVNode(unref(ContextMenu).ItemIndicator, { "as-child": "" }, {
-                      default: withCtx(() => {
-                        var _a2, _b2;
-                        return [
-                          createVNode(_sfc_main$d, {
-                            name: __props.checkedIcon || unref(appConfig).ui.icons.check,
-                            "data-slot": "itemTrailingIcon",
-                            class: __props.ui.itemTrailingIcon({ class: [(_a2 = __props.uiOverride) == null ? void 0 : _a2.itemTrailingIcon, (_b2 = item.ui) == null ? void 0 : _b2.itemTrailingIcon], color: item == null ? void 0 : item.color })
-                          }, null, 8, ["name", "class"])
-                        ];
-                      }),
-                      _: 2
-                    }, 1024)
-                  ], 2)
-                ];
-              })
+                  ]),
+                  createVNode(unref(ContextMenu).ItemIndicator, { "as-child": "" }, {
+                    default: withCtx(() => [
+                      createVNode(_sfc_main$d, {
+                        name: __props.checkedIcon || unref(appConfig).ui.icons.check,
+                        "data-slot": "itemTrailingIcon",
+                        class: __props.ui.itemTrailingIcon({ class: [__props.uiOverride?.itemTrailingIcon, item.ui?.itemTrailingIcon], color: item?.color })
+                      }, null, 8, ["name", "class"])
+                    ]),
+                    _: 2
+                  }, 1024)
+                ], 2)
+              ])
             ];
           }
         }),
@@ -311,36 +290,32 @@ const _sfc_main$2 = {
       }, _parent));
       _push(ssrRenderComponent(unref(ContextMenu).Portal, unref(portalProps), {
         default: withCtx((_, _push2, _parent2, _scopeId) => {
-          var _a, _b;
           if (_push2) {
             ssrRenderVNode(_push2, createVNode(resolveDynamicComponent(__props.sub ? unref(ContextMenu).SubContent : unref(ContextMenu).Content), mergeProps({
               "data-slot": "content",
-              class: __props.ui.content({ class: [(_a = __props.uiOverride) == null ? void 0 : _a.content, props.class] })
+              class: __props.ui.content({ class: [__props.uiOverride?.content, props.class] })
             }, unref(contentProps)), {
               default: withCtx((_2, _push3, _parent3, _scopeId2) => {
-                var _a2, _b2, _c, _d, _e, _f;
                 if (_push3) {
                   ssrRenderSlot(_ctx.$slots, "content-top", {
-                    sub: (_a2 = __props.sub) != null ? _a2 : false
+                    sub: __props.sub ?? false
                   }, null, _push3, _parent3, _scopeId2);
-                  _push3(`<div role="presentation" data-slot="viewport" class="${ssrRenderClass(__props.ui.viewport({ class: (_b2 = __props.uiOverride) == null ? void 0 : _b2.viewport }))}"${_scopeId2}><!--[-->`);
+                  _push3(`<div role="presentation" data-slot="viewport" class="${ssrRenderClass(__props.ui.viewport({ class: __props.uiOverride?.viewport }))}"${_scopeId2}><!--[-->`);
                   ssrRenderList(groups.value, (group, groupIndex) => {
-                    var _a3;
                     _push3(ssrRenderComponent(unref(ContextMenu).Group, {
                       key: `group-${groupIndex}`,
                       "data-slot": "group",
-                      class: __props.ui.group({ class: (_a3 = __props.uiOverride) == null ? void 0 : _a3.group })
+                      class: __props.ui.group({ class: __props.uiOverride?.group })
                     }, {
                       default: withCtx((_3, _push4, _parent4, _scopeId3) => {
                         if (_push4) {
                           _push4(`<!--[-->`);
                           ssrRenderList(group, (item, index) => {
-                            var _a4, _b3, _c2, _d2, _e2, _f2, _g;
                             _push4(`<!--[-->`);
                             if (item.type === "label") {
                               _push4(ssrRenderComponent(unref(ContextMenu).Label, {
                                 "data-slot": "label",
-                                class: __props.ui.label({ class: [(_a4 = __props.uiOverride) == null ? void 0 : _a4.label, (_b3 = item.ui) == null ? void 0 : _b3.label, item.class] })
+                                class: __props.ui.label({ class: [__props.uiOverride?.label, item.ui?.label, item.class] })
                               }, {
                                 default: withCtx((_4, _push5, _parent5, _scopeId4) => {
                                   if (_push5) {
@@ -362,15 +337,14 @@ const _sfc_main$2 = {
                             } else if (item.type === "separator") {
                               _push4(ssrRenderComponent(unref(ContextMenu).Separator, {
                                 "data-slot": "separator",
-                                class: __props.ui.separator({ class: [(_c2 = __props.uiOverride) == null ? void 0 : _c2.separator, (_d2 = item.ui) == null ? void 0 : _d2.separator, item.class] })
+                                class: __props.ui.separator({ class: [__props.uiOverride?.separator, item.ui?.separator, item.class] })
                               }, null, _parent4, _scopeId3));
-                            } else if ((_e2 = item == null ? void 0 : item.children) == null ? void 0 : _e2.length) {
+                            } else if (item?.children?.length) {
                               _push4(ssrRenderComponent(unref(ContextMenu).Sub, {
                                 open: item.open,
                                 "default-open": item.defaultOpen
                               }, {
                                 default: withCtx((_4, _push5, _parent5, _scopeId4) => {
-                                  var _a5, _b4, _c3, _d3, _e3, _f3;
                                   if (_push5) {
                                     _push5(ssrRenderComponent(unref(ContextMenu).SubTrigger, {
                                       as: "button",
@@ -378,7 +352,7 @@ const _sfc_main$2 = {
                                       disabled: item.disabled,
                                       "text-value": unref(get)(item, props.labelKey),
                                       "data-slot": "item",
-                                      class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], color: item == null ? void 0 : item.color })
+                                      class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color })
                                     }, {
                                       default: withCtx((_5, _push6, _parent6, _scopeId5) => {
                                         if (_push6) {
@@ -399,7 +373,7 @@ const _sfc_main$2 = {
                                     }, _parent5, _scopeId4));
                                     _push5(ssrRenderComponent(_sfc_main$2, mergeProps({
                                       sub: "",
-                                      class: (_c3 = item.ui) == null ? void 0 : _c3.content,
+                                      class: item.ui?.content,
                                       ui: __props.ui,
                                       "ui-override": __props.uiOverride,
                                       portal: __props.portal,
@@ -434,7 +408,7 @@ const _sfc_main$2 = {
                                         disabled: item.disabled,
                                         "text-value": unref(get)(item, props.labelKey),
                                         "data-slot": "item",
-                                        class: __props.ui.item({ class: [(_d3 = __props.uiOverride) == null ? void 0 : _d3.item, (_e3 = item.ui) == null ? void 0 : _e3.item, item.class], color: item == null ? void 0 : item.color })
+                                        class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color })
                                       }, {
                                         default: withCtx(() => [
                                           createVNode(unref(ReuseItemTemplate), {
@@ -446,7 +420,7 @@ const _sfc_main$2 = {
                                       }, 1032, ["disabled", "text-value", "class"]),
                                       createVNode(_sfc_main$2, mergeProps({
                                         sub: "",
-                                        class: (_f3 = item.ui) == null ? void 0 : _f3.content,
+                                        class: item.ui?.content,
                                         ui: __props.ui,
                                         "ui-override": __props.uiOverride,
                                         portal: __props.portal,
@@ -478,7 +452,7 @@ const _sfc_main$2 = {
                                 disabled: item.disabled,
                                 "text-value": unref(get)(item, props.labelKey),
                                 "data-slot": "item",
-                                class: __props.ui.item({ class: [(_f2 = __props.uiOverride) == null ? void 0 : _f2.item, (_g = item.ui) == null ? void 0 : _g.item, item.class], color: item == null ? void 0 : item.color }),
+                                class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color }),
                                 "onUpdate:modelValue": item.onUpdateChecked,
                                 onSelect: item.onSelect
                               }, {
@@ -510,11 +484,10 @@ const _sfc_main$2 = {
                                   if (_push5) {
                                     _push5(ssrRenderComponent(_sfc_main$9, mergeProps({ ref_for: true }, unref(pickLinkProps)(item), { custom: "" }), {
                                       default: withCtx(({ active, ...slotProps }, _push6, _parent6, _scopeId5) => {
-                                        var _a5, _b4, _c3, _d3;
                                         if (_push6) {
                                           _push6(ssrRenderComponent(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
                                             "data-slot": "item",
-                                            class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], active, color: item == null ? void 0 : item.color })
+                                            class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], active, color: item?.color })
                                           }), {
                                             default: withCtx((_5, _push7, _parent7, _scopeId6) => {
                                               if (_push7) {
@@ -539,7 +512,7 @@ const _sfc_main$2 = {
                                           return [
                                             createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
                                               "data-slot": "item",
-                                              class: __props.ui.item({ class: [(_c3 = __props.uiOverride) == null ? void 0 : _c3.item, (_d3 = item.ui) == null ? void 0 : _d3.item, item.class], active, color: item == null ? void 0 : item.color })
+                                              class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], active, color: item?.color })
                                             }), {
                                               default: withCtx(() => [
                                                 createVNode(unref(ReuseItemTemplate), {
@@ -558,24 +531,21 @@ const _sfc_main$2 = {
                                   } else {
                                     return [
                                       createVNode(_sfc_main$9, mergeProps({ ref_for: true }, unref(pickLinkProps)(item), { custom: "" }), {
-                                        default: withCtx(({ active, ...slotProps }) => {
-                                          var _a5, _b4;
-                                          return [
-                                            createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
-                                              "data-slot": "item",
-                                              class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], active, color: item == null ? void 0 : item.color })
-                                            }), {
-                                              default: withCtx(() => [
-                                                createVNode(unref(ReuseItemTemplate), {
-                                                  item,
-                                                  active,
-                                                  index
-                                                }, null, 8, ["item", "active", "index"])
-                                              ]),
-                                              _: 2
-                                            }, 1040, ["class"])
-                                          ];
-                                        }),
+                                        default: withCtx(({ active, ...slotProps }) => [
+                                          createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
+                                            "data-slot": "item",
+                                            class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], active, color: item?.color })
+                                          }), {
+                                            default: withCtx(() => [
+                                              createVNode(unref(ReuseItemTemplate), {
+                                                item,
+                                                active,
+                                                index
+                                              }, null, 8, ["item", "active", "index"])
+                                            ]),
+                                            _: 2
+                                          }, 1040, ["class"])
+                                        ]),
                                         _: 2
                                       }, 1040)
                                     ];
@@ -590,14 +560,13 @@ const _sfc_main$2 = {
                         } else {
                           return [
                             (openBlock(true), createBlock(Fragment, null, renderList(group, (item, index) => {
-                              var _a4, _b3, _c2, _d2, _e2, _f2, _g;
                               return openBlock(), createBlock(Fragment, {
                                 key: `group-${groupIndex}-${index}`
                               }, [
                                 item.type === "label" ? (openBlock(), createBlock(unref(ContextMenu).Label, {
                                   key: 0,
                                   "data-slot": "label",
-                                  class: __props.ui.label({ class: [(_a4 = __props.uiOverride) == null ? void 0 : _a4.label, (_b3 = item.ui) == null ? void 0 : _b3.label, item.class] })
+                                  class: __props.ui.label({ class: [__props.uiOverride?.label, item.ui?.label, item.class] })
                                 }, {
                                   default: withCtx(() => [
                                     createVNode(unref(ReuseItemTemplate), {
@@ -609,56 +578,53 @@ const _sfc_main$2 = {
                                 }, 1032, ["class"])) : item.type === "separator" ? (openBlock(), createBlock(unref(ContextMenu).Separator, {
                                   key: 1,
                                   "data-slot": "separator",
-                                  class: __props.ui.separator({ class: [(_c2 = __props.uiOverride) == null ? void 0 : _c2.separator, (_d2 = item.ui) == null ? void 0 : _d2.separator, item.class] })
-                                }, null, 8, ["class"])) : ((_e2 = item == null ? void 0 : item.children) == null ? void 0 : _e2.length) ? (openBlock(), createBlock(unref(ContextMenu).Sub, {
+                                  class: __props.ui.separator({ class: [__props.uiOverride?.separator, item.ui?.separator, item.class] })
+                                }, null, 8, ["class"])) : item?.children?.length ? (openBlock(), createBlock(unref(ContextMenu).Sub, {
                                   key: 2,
                                   open: item.open,
                                   "default-open": item.defaultOpen
                                 }, {
-                                  default: withCtx(() => {
-                                    var _a5, _b4, _c3;
-                                    return [
-                                      createVNode(unref(ContextMenu).SubTrigger, {
-                                        as: "button",
-                                        type: "button",
-                                        disabled: item.disabled,
-                                        "text-value": unref(get)(item, props.labelKey),
-                                        "data-slot": "item",
-                                        class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], color: item == null ? void 0 : item.color })
-                                      }, {
-                                        default: withCtx(() => [
-                                          createVNode(unref(ReuseItemTemplate), {
-                                            item,
-                                            index
-                                          }, null, 8, ["item", "index"])
-                                        ]),
-                                        _: 2
-                                      }, 1032, ["disabled", "text-value", "class"]),
-                                      createVNode(_sfc_main$2, mergeProps({
-                                        sub: "",
-                                        class: (_c3 = item.ui) == null ? void 0 : _c3.content,
-                                        ui: __props.ui,
-                                        "ui-override": __props.uiOverride,
-                                        portal: __props.portal,
-                                        items: item.children,
-                                        "align-offset": -4,
-                                        "label-key": __props.labelKey,
-                                        "description-key": __props.descriptionKey,
-                                        "checked-icon": __props.checkedIcon,
-                                        "loading-icon": __props.loadingIcon,
-                                        "external-icon": __props.externalIcon
-                                      }, { ref_for: true }, item.content), createSlots({ _: 2 }, [
-                                        renderList(getProxySlots(), (_4, name) => {
-                                          return {
-                                            name,
-                                            fn: withCtx((slotData) => [
-                                              renderSlot(_ctx.$slots, name, mergeProps({ ref_for: true }, slotData))
-                                            ])
-                                          };
-                                        })
-                                      ]), 1040, ["class", "ui", "ui-override", "portal", "items", "label-key", "description-key", "checked-icon", "loading-icon", "external-icon"])
-                                    ];
-                                  }),
+                                  default: withCtx(() => [
+                                    createVNode(unref(ContextMenu).SubTrigger, {
+                                      as: "button",
+                                      type: "button",
+                                      disabled: item.disabled,
+                                      "text-value": unref(get)(item, props.labelKey),
+                                      "data-slot": "item",
+                                      class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color })
+                                    }, {
+                                      default: withCtx(() => [
+                                        createVNode(unref(ReuseItemTemplate), {
+                                          item,
+                                          index
+                                        }, null, 8, ["item", "index"])
+                                      ]),
+                                      _: 2
+                                    }, 1032, ["disabled", "text-value", "class"]),
+                                    createVNode(_sfc_main$2, mergeProps({
+                                      sub: "",
+                                      class: item.ui?.content,
+                                      ui: __props.ui,
+                                      "ui-override": __props.uiOverride,
+                                      portal: __props.portal,
+                                      items: item.children,
+                                      "align-offset": -4,
+                                      "label-key": __props.labelKey,
+                                      "description-key": __props.descriptionKey,
+                                      "checked-icon": __props.checkedIcon,
+                                      "loading-icon": __props.loadingIcon,
+                                      "external-icon": __props.externalIcon
+                                    }, { ref_for: true }, item.content), createSlots({ _: 2 }, [
+                                      renderList(getProxySlots(), (_4, name) => {
+                                        return {
+                                          name,
+                                          fn: withCtx((slotData) => [
+                                            renderSlot(_ctx.$slots, name, mergeProps({ ref_for: true }, slotData))
+                                          ])
+                                        };
+                                      })
+                                    ]), 1040, ["class", "ui", "ui-override", "portal", "items", "label-key", "description-key", "checked-icon", "loading-icon", "external-icon"])
+                                  ]),
                                   _: 2
                                 }, 1032, ["open", "default-open"])) : item.type === "checkbox" ? (openBlock(), createBlock(unref(ContextMenu).CheckboxItem, {
                                   key: 3,
@@ -666,7 +632,7 @@ const _sfc_main$2 = {
                                   disabled: item.disabled,
                                   "text-value": unref(get)(item, props.labelKey),
                                   "data-slot": "item",
-                                  class: __props.ui.item({ class: [(_f2 = __props.uiOverride) == null ? void 0 : _f2.item, (_g = item.ui) == null ? void 0 : _g.item, item.class], color: item == null ? void 0 : item.color }),
+                                  class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color }),
                                   "onUpdate:modelValue": item.onUpdateChecked,
                                   onSelect: item.onSelect
                                 }, {
@@ -686,24 +652,21 @@ const _sfc_main$2 = {
                                 }, {
                                   default: withCtx(() => [
                                     createVNode(_sfc_main$9, mergeProps({ ref_for: true }, unref(pickLinkProps)(item), { custom: "" }), {
-                                      default: withCtx(({ active, ...slotProps }) => {
-                                        var _a5, _b4;
-                                        return [
-                                          createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
-                                            "data-slot": "item",
-                                            class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], active, color: item == null ? void 0 : item.color })
-                                          }), {
-                                            default: withCtx(() => [
-                                              createVNode(unref(ReuseItemTemplate), {
-                                                item,
-                                                active,
-                                                index
-                                              }, null, 8, ["item", "active", "index"])
-                                            ]),
-                                            _: 2
-                                          }, 1040, ["class"])
-                                        ];
-                                      }),
+                                      default: withCtx(({ active, ...slotProps }) => [
+                                        createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
+                                          "data-slot": "item",
+                                          class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], active, color: item?.color })
+                                        }), {
+                                          default: withCtx(() => [
+                                            createVNode(unref(ReuseItemTemplate), {
+                                              item,
+                                              active,
+                                              index
+                                            }, null, 8, ["item", "active", "index"])
+                                          ]),
+                                          _: 2
+                                        }, 1040, ["class"])
+                                      ]),
                                       _: 2
                                     }, 1040)
                                   ]),
@@ -720,35 +683,33 @@ const _sfc_main$2 = {
                   _push3(`<!--]--></div>`);
                   ssrRenderSlot(_ctx.$slots, "default", {}, null, _push3, _parent3, _scopeId2);
                   ssrRenderSlot(_ctx.$slots, "content-bottom", {
-                    sub: (_c = __props.sub) != null ? _c : false
+                    sub: __props.sub ?? false
                   }, null, _push3, _parent3, _scopeId2);
                 } else {
                   return [
                     renderSlot(_ctx.$slots, "content-top", {
-                      sub: (_d = __props.sub) != null ? _d : false
+                      sub: __props.sub ?? false
                     }),
                     createVNode("div", {
                       role: "presentation",
                       "data-slot": "viewport",
-                      class: __props.ui.viewport({ class: (_e = __props.uiOverride) == null ? void 0 : _e.viewport })
+                      class: __props.ui.viewport({ class: __props.uiOverride?.viewport })
                     }, [
                       (openBlock(true), createBlock(Fragment, null, renderList(groups.value, (group, groupIndex) => {
-                        var _a3;
                         return openBlock(), createBlock(unref(ContextMenu).Group, {
                           key: `group-${groupIndex}`,
                           "data-slot": "group",
-                          class: __props.ui.group({ class: (_a3 = __props.uiOverride) == null ? void 0 : _a3.group })
+                          class: __props.ui.group({ class: __props.uiOverride?.group })
                         }, {
                           default: withCtx(() => [
                             (openBlock(true), createBlock(Fragment, null, renderList(group, (item, index) => {
-                              var _a4, _b3, _c2, _d2, _e2, _f2, _g;
                               return openBlock(), createBlock(Fragment, {
                                 key: `group-${groupIndex}-${index}`
                               }, [
                                 item.type === "label" ? (openBlock(), createBlock(unref(ContextMenu).Label, {
                                   key: 0,
                                   "data-slot": "label",
-                                  class: __props.ui.label({ class: [(_a4 = __props.uiOverride) == null ? void 0 : _a4.label, (_b3 = item.ui) == null ? void 0 : _b3.label, item.class] })
+                                  class: __props.ui.label({ class: [__props.uiOverride?.label, item.ui?.label, item.class] })
                                 }, {
                                   default: withCtx(() => [
                                     createVNode(unref(ReuseItemTemplate), {
@@ -760,56 +721,53 @@ const _sfc_main$2 = {
                                 }, 1032, ["class"])) : item.type === "separator" ? (openBlock(), createBlock(unref(ContextMenu).Separator, {
                                   key: 1,
                                   "data-slot": "separator",
-                                  class: __props.ui.separator({ class: [(_c2 = __props.uiOverride) == null ? void 0 : _c2.separator, (_d2 = item.ui) == null ? void 0 : _d2.separator, item.class] })
-                                }, null, 8, ["class"])) : ((_e2 = item == null ? void 0 : item.children) == null ? void 0 : _e2.length) ? (openBlock(), createBlock(unref(ContextMenu).Sub, {
+                                  class: __props.ui.separator({ class: [__props.uiOverride?.separator, item.ui?.separator, item.class] })
+                                }, null, 8, ["class"])) : item?.children?.length ? (openBlock(), createBlock(unref(ContextMenu).Sub, {
                                   key: 2,
                                   open: item.open,
                                   "default-open": item.defaultOpen
                                 }, {
-                                  default: withCtx(() => {
-                                    var _a5, _b4, _c3;
-                                    return [
-                                      createVNode(unref(ContextMenu).SubTrigger, {
-                                        as: "button",
-                                        type: "button",
-                                        disabled: item.disabled,
-                                        "text-value": unref(get)(item, props.labelKey),
-                                        "data-slot": "item",
-                                        class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], color: item == null ? void 0 : item.color })
-                                      }, {
-                                        default: withCtx(() => [
-                                          createVNode(unref(ReuseItemTemplate), {
-                                            item,
-                                            index
-                                          }, null, 8, ["item", "index"])
-                                        ]),
-                                        _: 2
-                                      }, 1032, ["disabled", "text-value", "class"]),
-                                      createVNode(_sfc_main$2, mergeProps({
-                                        sub: "",
-                                        class: (_c3 = item.ui) == null ? void 0 : _c3.content,
-                                        ui: __props.ui,
-                                        "ui-override": __props.uiOverride,
-                                        portal: __props.portal,
-                                        items: item.children,
-                                        "align-offset": -4,
-                                        "label-key": __props.labelKey,
-                                        "description-key": __props.descriptionKey,
-                                        "checked-icon": __props.checkedIcon,
-                                        "loading-icon": __props.loadingIcon,
-                                        "external-icon": __props.externalIcon
-                                      }, { ref_for: true }, item.content), createSlots({ _: 2 }, [
-                                        renderList(getProxySlots(), (_3, name) => {
-                                          return {
-                                            name,
-                                            fn: withCtx((slotData) => [
-                                              renderSlot(_ctx.$slots, name, mergeProps({ ref_for: true }, slotData))
-                                            ])
-                                          };
-                                        })
-                                      ]), 1040, ["class", "ui", "ui-override", "portal", "items", "label-key", "description-key", "checked-icon", "loading-icon", "external-icon"])
-                                    ];
-                                  }),
+                                  default: withCtx(() => [
+                                    createVNode(unref(ContextMenu).SubTrigger, {
+                                      as: "button",
+                                      type: "button",
+                                      disabled: item.disabled,
+                                      "text-value": unref(get)(item, props.labelKey),
+                                      "data-slot": "item",
+                                      class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color })
+                                    }, {
+                                      default: withCtx(() => [
+                                        createVNode(unref(ReuseItemTemplate), {
+                                          item,
+                                          index
+                                        }, null, 8, ["item", "index"])
+                                      ]),
+                                      _: 2
+                                    }, 1032, ["disabled", "text-value", "class"]),
+                                    createVNode(_sfc_main$2, mergeProps({
+                                      sub: "",
+                                      class: item.ui?.content,
+                                      ui: __props.ui,
+                                      "ui-override": __props.uiOverride,
+                                      portal: __props.portal,
+                                      items: item.children,
+                                      "align-offset": -4,
+                                      "label-key": __props.labelKey,
+                                      "description-key": __props.descriptionKey,
+                                      "checked-icon": __props.checkedIcon,
+                                      "loading-icon": __props.loadingIcon,
+                                      "external-icon": __props.externalIcon
+                                    }, { ref_for: true }, item.content), createSlots({ _: 2 }, [
+                                      renderList(getProxySlots(), (_3, name) => {
+                                        return {
+                                          name,
+                                          fn: withCtx((slotData) => [
+                                            renderSlot(_ctx.$slots, name, mergeProps({ ref_for: true }, slotData))
+                                          ])
+                                        };
+                                      })
+                                    ]), 1040, ["class", "ui", "ui-override", "portal", "items", "label-key", "description-key", "checked-icon", "loading-icon", "external-icon"])
+                                  ]),
                                   _: 2
                                 }, 1032, ["open", "default-open"])) : item.type === "checkbox" ? (openBlock(), createBlock(unref(ContextMenu).CheckboxItem, {
                                   key: 3,
@@ -817,7 +775,7 @@ const _sfc_main$2 = {
                                   disabled: item.disabled,
                                   "text-value": unref(get)(item, props.labelKey),
                                   "data-slot": "item",
-                                  class: __props.ui.item({ class: [(_f2 = __props.uiOverride) == null ? void 0 : _f2.item, (_g = item.ui) == null ? void 0 : _g.item, item.class], color: item == null ? void 0 : item.color }),
+                                  class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color }),
                                   "onUpdate:modelValue": item.onUpdateChecked,
                                   onSelect: item.onSelect
                                 }, {
@@ -837,24 +795,21 @@ const _sfc_main$2 = {
                                 }, {
                                   default: withCtx(() => [
                                     createVNode(_sfc_main$9, mergeProps({ ref_for: true }, unref(pickLinkProps)(item), { custom: "" }), {
-                                      default: withCtx(({ active, ...slotProps }) => {
-                                        var _a5, _b4;
-                                        return [
-                                          createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
-                                            "data-slot": "item",
-                                            class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], active, color: item == null ? void 0 : item.color })
-                                          }), {
-                                            default: withCtx(() => [
-                                              createVNode(unref(ReuseItemTemplate), {
-                                                item,
-                                                active,
-                                                index
-                                              }, null, 8, ["item", "active", "index"])
-                                            ]),
-                                            _: 2
-                                          }, 1040, ["class"])
-                                        ];
-                                      }),
+                                      default: withCtx(({ active, ...slotProps }) => [
+                                        createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
+                                          "data-slot": "item",
+                                          class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], active, color: item?.color })
+                                        }), {
+                                          default: withCtx(() => [
+                                            createVNode(unref(ReuseItemTemplate), {
+                                              item,
+                                              active,
+                                              index
+                                            }, null, 8, ["item", "active", "index"])
+                                          ]),
+                                          _: 2
+                                        }, 1040, ["class"])
+                                      ]),
                                       _: 2
                                     }, 1040)
                                   ]),
@@ -869,7 +824,7 @@ const _sfc_main$2 = {
                     ], 2),
                     renderSlot(_ctx.$slots, "default"),
                     renderSlot(_ctx.$slots, "content-bottom", {
-                      sub: (_f = __props.sub) != null ? _f : false
+                      sub: __props.sub ?? false
                     })
                   ];
                 }
@@ -880,160 +835,149 @@ const _sfc_main$2 = {
             return [
               (openBlock(), createBlock(resolveDynamicComponent(__props.sub ? unref(ContextMenu).SubContent : unref(ContextMenu).Content), mergeProps({
                 "data-slot": "content",
-                class: __props.ui.content({ class: [(_b = __props.uiOverride) == null ? void 0 : _b.content, props.class] })
+                class: __props.ui.content({ class: [__props.uiOverride?.content, props.class] })
               }, unref(contentProps)), {
-                default: withCtx(() => {
-                  var _a2, _b2, _c;
-                  return [
-                    renderSlot(_ctx.$slots, "content-top", {
-                      sub: (_a2 = __props.sub) != null ? _a2 : false
-                    }),
-                    createVNode("div", {
-                      role: "presentation",
-                      "data-slot": "viewport",
-                      class: __props.ui.viewport({ class: (_b2 = __props.uiOverride) == null ? void 0 : _b2.viewport })
-                    }, [
-                      (openBlock(true), createBlock(Fragment, null, renderList(groups.value, (group, groupIndex) => {
-                        var _a3;
-                        return openBlock(), createBlock(unref(ContextMenu).Group, {
-                          key: `group-${groupIndex}`,
-                          "data-slot": "group",
-                          class: __props.ui.group({ class: (_a3 = __props.uiOverride) == null ? void 0 : _a3.group })
-                        }, {
-                          default: withCtx(() => [
-                            (openBlock(true), createBlock(Fragment, null, renderList(group, (item, index) => {
-                              var _a4, _b3, _c2, _d, _e, _f, _g;
-                              return openBlock(), createBlock(Fragment, {
-                                key: `group-${groupIndex}-${index}`
-                              }, [
-                                item.type === "label" ? (openBlock(), createBlock(unref(ContextMenu).Label, {
-                                  key: 0,
-                                  "data-slot": "label",
-                                  class: __props.ui.label({ class: [(_a4 = __props.uiOverride) == null ? void 0 : _a4.label, (_b3 = item.ui) == null ? void 0 : _b3.label, item.class] })
-                                }, {
-                                  default: withCtx(() => [
-                                    createVNode(unref(ReuseItemTemplate), {
-                                      item,
-                                      index
-                                    }, null, 8, ["item", "index"])
-                                  ]),
-                                  _: 2
-                                }, 1032, ["class"])) : item.type === "separator" ? (openBlock(), createBlock(unref(ContextMenu).Separator, {
-                                  key: 1,
-                                  "data-slot": "separator",
-                                  class: __props.ui.separator({ class: [(_c2 = __props.uiOverride) == null ? void 0 : _c2.separator, (_d = item.ui) == null ? void 0 : _d.separator, item.class] })
-                                }, null, 8, ["class"])) : ((_e = item == null ? void 0 : item.children) == null ? void 0 : _e.length) ? (openBlock(), createBlock(unref(ContextMenu).Sub, {
-                                  key: 2,
-                                  open: item.open,
-                                  "default-open": item.defaultOpen
-                                }, {
-                                  default: withCtx(() => {
-                                    var _a5, _b4, _c3;
-                                    return [
-                                      createVNode(unref(ContextMenu).SubTrigger, {
-                                        as: "button",
-                                        type: "button",
-                                        disabled: item.disabled,
-                                        "text-value": unref(get)(item, props.labelKey),
+                default: withCtx(() => [
+                  renderSlot(_ctx.$slots, "content-top", {
+                    sub: __props.sub ?? false
+                  }),
+                  createVNode("div", {
+                    role: "presentation",
+                    "data-slot": "viewport",
+                    class: __props.ui.viewport({ class: __props.uiOverride?.viewport })
+                  }, [
+                    (openBlock(true), createBlock(Fragment, null, renderList(groups.value, (group, groupIndex) => {
+                      return openBlock(), createBlock(unref(ContextMenu).Group, {
+                        key: `group-${groupIndex}`,
+                        "data-slot": "group",
+                        class: __props.ui.group({ class: __props.uiOverride?.group })
+                      }, {
+                        default: withCtx(() => [
+                          (openBlock(true), createBlock(Fragment, null, renderList(group, (item, index) => {
+                            return openBlock(), createBlock(Fragment, {
+                              key: `group-${groupIndex}-${index}`
+                            }, [
+                              item.type === "label" ? (openBlock(), createBlock(unref(ContextMenu).Label, {
+                                key: 0,
+                                "data-slot": "label",
+                                class: __props.ui.label({ class: [__props.uiOverride?.label, item.ui?.label, item.class] })
+                              }, {
+                                default: withCtx(() => [
+                                  createVNode(unref(ReuseItemTemplate), {
+                                    item,
+                                    index
+                                  }, null, 8, ["item", "index"])
+                                ]),
+                                _: 2
+                              }, 1032, ["class"])) : item.type === "separator" ? (openBlock(), createBlock(unref(ContextMenu).Separator, {
+                                key: 1,
+                                "data-slot": "separator",
+                                class: __props.ui.separator({ class: [__props.uiOverride?.separator, item.ui?.separator, item.class] })
+                              }, null, 8, ["class"])) : item?.children?.length ? (openBlock(), createBlock(unref(ContextMenu).Sub, {
+                                key: 2,
+                                open: item.open,
+                                "default-open": item.defaultOpen
+                              }, {
+                                default: withCtx(() => [
+                                  createVNode(unref(ContextMenu).SubTrigger, {
+                                    as: "button",
+                                    type: "button",
+                                    disabled: item.disabled,
+                                    "text-value": unref(get)(item, props.labelKey),
+                                    "data-slot": "item",
+                                    class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color })
+                                  }, {
+                                    default: withCtx(() => [
+                                      createVNode(unref(ReuseItemTemplate), {
+                                        item,
+                                        index
+                                      }, null, 8, ["item", "index"])
+                                    ]),
+                                    _: 2
+                                  }, 1032, ["disabled", "text-value", "class"]),
+                                  createVNode(_sfc_main$2, mergeProps({
+                                    sub: "",
+                                    class: item.ui?.content,
+                                    ui: __props.ui,
+                                    "ui-override": __props.uiOverride,
+                                    portal: __props.portal,
+                                    items: item.children,
+                                    "align-offset": -4,
+                                    "label-key": __props.labelKey,
+                                    "description-key": __props.descriptionKey,
+                                    "checked-icon": __props.checkedIcon,
+                                    "loading-icon": __props.loadingIcon,
+                                    "external-icon": __props.externalIcon
+                                  }, { ref_for: true }, item.content), createSlots({ _: 2 }, [
+                                    renderList(getProxySlots(), (_2, name) => {
+                                      return {
+                                        name,
+                                        fn: withCtx((slotData) => [
+                                          renderSlot(_ctx.$slots, name, mergeProps({ ref_for: true }, slotData))
+                                        ])
+                                      };
+                                    })
+                                  ]), 1040, ["class", "ui", "ui-override", "portal", "items", "label-key", "description-key", "checked-icon", "loading-icon", "external-icon"])
+                                ]),
+                                _: 2
+                              }, 1032, ["open", "default-open"])) : item.type === "checkbox" ? (openBlock(), createBlock(unref(ContextMenu).CheckboxItem, {
+                                key: 3,
+                                "model-value": item.checked,
+                                disabled: item.disabled,
+                                "text-value": unref(get)(item, props.labelKey),
+                                "data-slot": "item",
+                                class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], color: item?.color }),
+                                "onUpdate:modelValue": item.onUpdateChecked,
+                                onSelect: item.onSelect
+                              }, {
+                                default: withCtx(() => [
+                                  createVNode(unref(ReuseItemTemplate), {
+                                    item,
+                                    index
+                                  }, null, 8, ["item", "index"])
+                                ]),
+                                _: 2
+                              }, 1032, ["model-value", "disabled", "text-value", "class", "onUpdate:modelValue", "onSelect"])) : (openBlock(), createBlock(unref(ContextMenu).Item, {
+                                key: 4,
+                                "as-child": "",
+                                disabled: item.disabled,
+                                "text-value": unref(get)(item, props.labelKey),
+                                onSelect: item.onSelect
+                              }, {
+                                default: withCtx(() => [
+                                  createVNode(_sfc_main$9, mergeProps({ ref_for: true }, unref(pickLinkProps)(item), { custom: "" }), {
+                                    default: withCtx(({ active, ...slotProps }) => [
+                                      createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
                                         "data-slot": "item",
-                                        class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], color: item == null ? void 0 : item.color })
-                                      }, {
+                                        class: __props.ui.item({ class: [__props.uiOverride?.item, item.ui?.item, item.class], active, color: item?.color })
+                                      }), {
                                         default: withCtx(() => [
                                           createVNode(unref(ReuseItemTemplate), {
                                             item,
+                                            active,
                                             index
-                                          }, null, 8, ["item", "index"])
+                                          }, null, 8, ["item", "active", "index"])
                                         ]),
                                         _: 2
-                                      }, 1032, ["disabled", "text-value", "class"]),
-                                      createVNode(_sfc_main$2, mergeProps({
-                                        sub: "",
-                                        class: (_c3 = item.ui) == null ? void 0 : _c3.content,
-                                        ui: __props.ui,
-                                        "ui-override": __props.uiOverride,
-                                        portal: __props.portal,
-                                        items: item.children,
-                                        "align-offset": -4,
-                                        "label-key": __props.labelKey,
-                                        "description-key": __props.descriptionKey,
-                                        "checked-icon": __props.checkedIcon,
-                                        "loading-icon": __props.loadingIcon,
-                                        "external-icon": __props.externalIcon
-                                      }, { ref_for: true }, item.content), createSlots({ _: 2 }, [
-                                        renderList(getProxySlots(), (_2, name) => {
-                                          return {
-                                            name,
-                                            fn: withCtx((slotData) => [
-                                              renderSlot(_ctx.$slots, name, mergeProps({ ref_for: true }, slotData))
-                                            ])
-                                          };
-                                        })
-                                      ]), 1040, ["class", "ui", "ui-override", "portal", "items", "label-key", "description-key", "checked-icon", "loading-icon", "external-icon"])
-                                    ];
-                                  }),
-                                  _: 2
-                                }, 1032, ["open", "default-open"])) : item.type === "checkbox" ? (openBlock(), createBlock(unref(ContextMenu).CheckboxItem, {
-                                  key: 3,
-                                  "model-value": item.checked,
-                                  disabled: item.disabled,
-                                  "text-value": unref(get)(item, props.labelKey),
-                                  "data-slot": "item",
-                                  class: __props.ui.item({ class: [(_f = __props.uiOverride) == null ? void 0 : _f.item, (_g = item.ui) == null ? void 0 : _g.item, item.class], color: item == null ? void 0 : item.color }),
-                                  "onUpdate:modelValue": item.onUpdateChecked,
-                                  onSelect: item.onSelect
-                                }, {
-                                  default: withCtx(() => [
-                                    createVNode(unref(ReuseItemTemplate), {
-                                      item,
-                                      index
-                                    }, null, 8, ["item", "index"])
-                                  ]),
-                                  _: 2
-                                }, 1032, ["model-value", "disabled", "text-value", "class", "onUpdate:modelValue", "onSelect"])) : (openBlock(), createBlock(unref(ContextMenu).Item, {
-                                  key: 4,
-                                  "as-child": "",
-                                  disabled: item.disabled,
-                                  "text-value": unref(get)(item, props.labelKey),
-                                  onSelect: item.onSelect
-                                }, {
-                                  default: withCtx(() => [
-                                    createVNode(_sfc_main$9, mergeProps({ ref_for: true }, unref(pickLinkProps)(item), { custom: "" }), {
-                                      default: withCtx(({ active, ...slotProps }) => {
-                                        var _a5, _b4;
-                                        return [
-                                          createVNode(_sfc_main$a, mergeProps({ ref_for: true }, slotProps, {
-                                            "data-slot": "item",
-                                            class: __props.ui.item({ class: [(_a5 = __props.uiOverride) == null ? void 0 : _a5.item, (_b4 = item.ui) == null ? void 0 : _b4.item, item.class], active, color: item == null ? void 0 : item.color })
-                                          }), {
-                                            default: withCtx(() => [
-                                              createVNode(unref(ReuseItemTemplate), {
-                                                item,
-                                                active,
-                                                index
-                                              }, null, 8, ["item", "active", "index"])
-                                            ]),
-                                            _: 2
-                                          }, 1040, ["class"])
-                                        ];
-                                      }),
-                                      _: 2
-                                    }, 1040)
-                                  ]),
-                                  _: 2
-                                }, 1032, ["disabled", "text-value", "onSelect"]))
-                              ], 64);
-                            }), 128))
-                          ]),
-                          _: 2
-                        }, 1032, ["class"]);
-                      }), 128))
-                    ], 2),
-                    renderSlot(_ctx.$slots, "default"),
-                    renderSlot(_ctx.$slots, "content-bottom", {
-                      sub: (_c = __props.sub) != null ? _c : false
-                    })
-                  ];
-                }),
+                                      }, 1040, ["class"])
+                                    ]),
+                                    _: 2
+                                  }, 1040)
+                                ]),
+                                _: 2
+                              }, 1032, ["disabled", "text-value", "onSelect"]))
+                            ], 64);
+                          }), 128))
+                        ]),
+                        _: 2
+                      }, 1032, ["class"]);
+                    }), 128))
+                  ], 2),
+                  renderSlot(_ctx.$slots, "default"),
+                  renderSlot(_ctx.$slots, "content-bottom", {
+                    sub: __props.sub ?? false
+                  })
+                ]),
                 _: 3
               }, 16, ["class"]))
             ];
@@ -1280,16 +1224,12 @@ const _sfc_main$1 = {
     const rootProps = useForwardPropsEmits(reactivePick(props, "modal"), emits);
     const contentProps = toRef(() => props.content);
     const getProxySlots = () => omit(slots, ["default"]);
-    const ui = computed(() => {
-      var _a;
-      return tv({ extend: tv(theme$1), ...((_a = appConfig.ui) == null ? void 0 : _a.contextMenu) || {} })({
-        size: props.size
-      });
-    });
+    const ui = computed(() => tv({ extend: tv(theme$1), ...appConfig.ui?.contextMenu || {} })({
+      size: props.size
+    }));
     return (_ctx, _push, _parent, _attrs) => {
       _push(ssrRenderComponent(unref(ContextMenuRoot), mergeProps(unref(rootProps), _attrs), {
         default: withCtx((_, _push2, _parent2, _scopeId) => {
-          var _a, _b;
           if (_push2) {
             if (!!slots.default) {
               _push2(ssrRenderComponent(unref(ContextMenuTrigger), {
@@ -1312,7 +1252,7 @@ const _sfc_main$1 = {
               _push2(`<!---->`);
             }
             _push2(ssrRenderComponent(_sfc_main$2, mergeProps({
-              class: ui.value.content({ class: [!slots.default && props.class, (_a = props.ui) == null ? void 0 : _a.content] }),
+              class: ui.value.content({ class: [!slots.default && props.class, props.ui?.content] }),
               ui: ui.value,
               "ui-override": props.ui
             }, contentProps.value, {
@@ -1353,7 +1293,7 @@ const _sfc_main$1 = {
                 _: 3
               }, 8, ["disabled", "class"])) : createCommentVNode("", true),
               createVNode(_sfc_main$2, mergeProps({
-                class: ui.value.content({ class: [!slots.default && props.class, (_b = props.ui) == null ? void 0 : _b.content] }),
+                class: ui.value.content({ class: [!slots.default && props.class, props.ui?.content] }),
                 ui: ui.value,
                 "ui-override": props.ui
               }, contentProps.value, {
@@ -1575,8 +1515,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({ inheritAttrs: false }, {
     const appConfig = useAppConfig();
     const rootProps = useForwardPropsEmits(reactivePick(props, "items", "multiple", "expanded", "disabled", "propagateSelect", "bubbleSelect"), emits);
     const as = computed(() => {
-      var _a;
-      if (typeof props.as === "string" || typeof ((_a = props.as) == null ? void 0 : _a.render) === "function") {
+      if (typeof props.as === "string" || typeof props.as?.render === "function") {
         return { root: props.as, link: "button" };
       }
       return defu(props.as, { root: "ul", link: "button" });
@@ -1621,14 +1560,11 @@ const _sfc_main = /* @__PURE__ */ Object.assign({ inheritAttrs: false }, {
         }
       }
     });
-    const ui = computed(() => {
-      var _a;
-      return tv({ extend: tv(theme), ...((_a = appConfig.ui) == null ? void 0 : _a.tree) || {} })({
-        color: props.color,
-        size: props.size,
-        virtualize: !!props.virtualize
-      });
-    });
+    const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.tree || {} })({
+      color: props.color,
+      size: props.size,
+      virtualize: !!props.virtualize
+    }));
     const rootRef = useTemplateRef("rootRef");
     function getItemLabel(item) {
       return get(item, props.labelKey);
@@ -1637,78 +1573,61 @@ const _sfc_main = /* @__PURE__ */ Object.assign({ inheritAttrs: false }, {
       return props.getKey ? props.getKey(item) || getItemLabel(item) : getItemLabel(item);
     }
     function getDefaultOpenedItems(item) {
-      var _a, _b;
       const currentItem = item.defaultExpanded ? getItemKey(item) : null;
-      const childItems = (_b = (_a = item.children) == null ? void 0 : _a.flatMap((child) => getDefaultOpenedItems(child))) != null ? _b : [];
+      const childItems = item.children?.flatMap((child) => getDefaultOpenedItems(child)) ?? [];
       return [currentItem, ...childItems].filter(Boolean);
     }
-    const defaultExpanded = computed(() => {
-      var _a, _b;
-      return (_b = props.defaultExpanded) != null ? _b : (_a = props.items) == null ? void 0 : _a.flatMap((item) => getDefaultOpenedItems(item));
-    });
+    const defaultExpanded = computed(() => props.defaultExpanded ?? props.items?.flatMap((item) => getDefaultOpenedItems(item)));
     __expose({
       get $el() {
-        var _a;
-        return (_a = rootRef.value) == null ? void 0 : _a.$el;
+        return rootRef.value?.$el;
       }
     });
     return (_ctx, _push, _parent, _attrs) => {
-      var _a;
       _push(`<!--[-->`);
       _push(ssrRenderComponent(unref(DefineItemTemplate), null, {
         default: withCtx(({ item, index, level }, _push2, _parent2, _scopeId) => {
-          var _a2, _b, _c, _d, _e, _f, _g, _h;
           if (_push2) {
-            _push2(`<li role="presentation" class="${ssrRenderClass(!!nested.value && level > 1 ? ui.value.itemWithChildren({ class: [(_a2 = props.ui) == null ? void 0 : _a2.itemWithChildren, (_b = item.ui) == null ? void 0 : _b.itemWithChildren] }) : ui.value.item({ class: [(_c = props.ui) == null ? void 0 : _c.item, (_d = item.ui) == null ? void 0 : _d.item] }))}"${_scopeId}>`);
+            _push2(`<li role="presentation" class="${ssrRenderClass(!!nested.value && level > 1 ? ui.value.itemWithChildren({ class: [props.ui?.itemWithChildren, item.ui?.itemWithChildren] }) : ui.value.item({ class: [props.ui?.item, item.ui?.item] }))}"${_scopeId}>`);
             _push2(ssrRenderComponent(unref(TreeItem), {
               level,
               value: item,
               "as-child": "",
-              onToggle: ($event) => {
-                var _a3, _b2;
-                return (_b2 = (_a3 = item.onToggle) != null ? _a3 : props.onToggle) == null ? void 0 : _b2($event, item);
-              },
-              onSelect: ($event) => {
-                var _a3, _b2;
-                return (_b2 = (_a3 = item.onSelect) != null ? _a3 : props.onSelect) == null ? void 0 : _b2($event, item);
-              }
+              onToggle: ($event) => (item.onToggle ?? props.onToggle)?.($event, item),
+              onSelect: ($event) => (item.onSelect ?? props.onSelect)?.($event, item)
             }, {
               default: withCtx(({ isExpanded, isSelected, isIndeterminate, handleSelect, handleToggle }, _push3, _parent3, _scopeId2) => {
-                var _a3, _b2, _c2, _d2, _e2, _f2;
                 if (_push3) {
                   ssrRenderSlot(_ctx.$slots, item.slot ? `${item.slot}-wrapper` : "item-wrapper", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                    var _a4, _b3;
                     ssrRenderVNode(_push3, createVNode(resolveDynamicComponent(as.value.link), {
                       type: as.value.link === "button" ? "button" : void 0,
                       disabled: item.disabled || __props.disabled,
                       "data-slot": "link",
-                      class: ui.value.link({ class: [(_a4 = props.ui) == null ? void 0 : _a4.link, (_b3 = item.ui) == null ? void 0 : _b3.link, item.class], selected: isSelected, disabled: item.disabled || __props.disabled }),
+                      class: ui.value.link({ class: [props.ui?.link, item.ui?.link, item.class], selected: isSelected, disabled: item.disabled || __props.disabled }),
                       style: !nested.value && level > 1 ? { paddingLeft: flattenedPaddingFormula.value(level) } : void 0
                     }, {
                       default: withCtx((_, _push4, _parent4, _scopeId3) => {
                         if (_push4) {
                           ssrRenderSlot(_ctx.$slots, item.slot || "item", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                            var _a5, _b4, _c3, _d3, _e3;
                             ssrRenderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                              var _a6, _b5, _c4, _d4, _e4, _f3, _g2;
                               if (item.icon) {
                                 _push4(ssrRenderComponent(_sfc_main$d, {
                                   name: item.icon,
                                   "data-slot": "linkLeadingIcon",
-                                  class: ui.value.linkLeadingIcon({ class: [(_a6 = props.ui) == null ? void 0 : _a6.linkLeadingIcon, (_b5 = item.ui) == null ? void 0 : _b5.linkLeadingIcon] })
+                                  class: ui.value.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon] })
                                 }, null, _parent4, _scopeId3));
-                              } else if ((_c4 = item.children) == null ? void 0 : _c4.length) {
+                              } else if (item.children?.length) {
                                 _push4(ssrRenderComponent(_sfc_main$d, {
-                                  name: isExpanded ? (_d4 = __props.expandedIcon) != null ? _d4 : unref(appConfig).ui.icons.folderOpen : (_e4 = __props.collapsedIcon) != null ? _e4 : unref(appConfig).ui.icons.folder,
+                                  name: isExpanded ? __props.expandedIcon ?? unref(appConfig).ui.icons.folderOpen : __props.collapsedIcon ?? unref(appConfig).ui.icons.folder,
                                   "data-slot": "linkLeadingIcon",
-                                  class: ui.value.linkLeadingIcon({ class: [(_f3 = props.ui) == null ? void 0 : _f3.linkLeadingIcon, (_g2 = item.ui) == null ? void 0 : _g2.linkLeadingIcon] })
+                                  class: ui.value.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon] })
                                 }, null, _parent4, _scopeId3));
                               } else {
                                 _push4(`<!---->`);
                               }
                             }, _push4, _parent4, _scopeId3);
                             if (getItemLabel(item) || !!slots[item.slot ? `${item.slot}-label` : "item-label"]) {
-                              _push4(`<span data-slot="linkLabel" class="${ssrRenderClass(ui.value.linkLabel({ class: [(_a5 = props.ui) == null ? void 0 : _a5.linkLabel, (_b4 = item.ui) == null ? void 0 : _b4.linkLabel] }))}"${_scopeId3}>`);
+                              _push4(`<span data-slot="linkLabel" class="${ssrRenderClass(ui.value.linkLabel({ class: [props.ui?.linkLabel, item.ui?.linkLabel] }))}"${_scopeId3}>`);
                               ssrRenderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
                                 _push4(`${ssrInterpolate(getItemLabel(item))}`);
                               }, _push4, _parent4, _scopeId3);
@@ -1716,21 +1635,20 @@ const _sfc_main = /* @__PURE__ */ Object.assign({ inheritAttrs: false }, {
                             } else {
                               _push4(`<!---->`);
                             }
-                            if (item.trailingIcon || ((_c3 = item.children) == null ? void 0 : _c3.length) || !!slots[item.slot ? `${item.slot}-trailing` : "item-trailing"]) {
-                              _push4(`<span data-slot="linkTrailing" class="${ssrRenderClass(ui.value.linkTrailing({ class: [(_d3 = props.ui) == null ? void 0 : _d3.linkTrailing, (_e3 = item.ui) == null ? void 0 : _e3.linkTrailing] }))}"${_scopeId3}>`);
+                            if (item.trailingIcon || item.children?.length || !!slots[item.slot ? `${item.slot}-trailing` : "item-trailing"]) {
+                              _push4(`<span data-slot="linkTrailing" class="${ssrRenderClass(ui.value.linkTrailing({ class: [props.ui?.linkTrailing, item.ui?.linkTrailing] }))}"${_scopeId3}>`);
                               ssrRenderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                                var _a6, _b5, _c4, _d4, _e4, _f3;
                                 if (item.trailingIcon) {
                                   _push4(ssrRenderComponent(_sfc_main$d, {
                                     name: item.trailingIcon,
                                     "data-slot": "linkTrailingIcon",
-                                    class: ui.value.linkTrailingIcon({ class: [(_a6 = props.ui) == null ? void 0 : _a6.linkTrailingIcon, (_b5 = item.ui) == null ? void 0 : _b5.linkTrailingIcon] })
+                                    class: ui.value.linkTrailingIcon({ class: [props.ui?.linkTrailingIcon, item.ui?.linkTrailingIcon] })
                                   }, null, _parent4, _scopeId3));
-                                } else if ((_c4 = item.children) == null ? void 0 : _c4.length) {
+                                } else if (item.children?.length) {
                                   _push4(ssrRenderComponent(_sfc_main$d, {
-                                    name: (_d4 = __props.trailingIcon) != null ? _d4 : unref(appConfig).ui.icons.chevronDown,
+                                    name: __props.trailingIcon ?? unref(appConfig).ui.icons.chevronDown,
                                     "data-slot": "linkTrailingIcon",
-                                    class: ui.value.linkTrailingIcon({ class: [(_e4 = props.ui) == null ? void 0 : _e4.linkTrailingIcon, (_f3 = item.ui) == null ? void 0 : _f3.linkTrailingIcon] })
+                                    class: ui.value.linkTrailingIcon({ class: [props.ui?.linkTrailingIcon, item.ui?.linkTrailingIcon] })
                                   }, null, _parent4, _scopeId3));
                                 } else {
                                   _push4(`<!---->`);
@@ -1743,66 +1661,57 @@ const _sfc_main = /* @__PURE__ */ Object.assign({ inheritAttrs: false }, {
                           }, _push4, _parent4, _scopeId3);
                         } else {
                           return [
-                            renderSlot(_ctx.$slots, item.slot || "item", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                              var _a5, _b4, _c3, _d3, _e3;
-                              return [
-                                renderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                                  var _a6, _b5, _c4, _d4, _e4, _f3, _g2;
-                                  return [
-                                    item.icon ? (openBlock(), createBlock(_sfc_main$d, {
-                                      key: 0,
-                                      name: item.icon,
-                                      "data-slot": "linkLeadingIcon",
-                                      class: ui.value.linkLeadingIcon({ class: [(_a6 = props.ui) == null ? void 0 : _a6.linkLeadingIcon, (_b5 = item.ui) == null ? void 0 : _b5.linkLeadingIcon] })
-                                    }, null, 8, ["name", "class"])) : ((_c4 = item.children) == null ? void 0 : _c4.length) ? (openBlock(), createBlock(_sfc_main$d, {
-                                      key: 1,
-                                      name: isExpanded ? (_d4 = __props.expandedIcon) != null ? _d4 : unref(appConfig).ui.icons.folderOpen : (_e4 = __props.collapsedIcon) != null ? _e4 : unref(appConfig).ui.icons.folder,
-                                      "data-slot": "linkLeadingIcon",
-                                      class: ui.value.linkLeadingIcon({ class: [(_f3 = props.ui) == null ? void 0 : _f3.linkLeadingIcon, (_g2 = item.ui) == null ? void 0 : _g2.linkLeadingIcon] })
-                                    }, null, 8, ["name", "class"])) : createCommentVNode("", true)
-                                  ];
-                                }),
-                                getItemLabel(item) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] ? (openBlock(), createBlock("span", {
+                            renderSlot(_ctx.$slots, item.slot || "item", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                              renderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                                item.icon ? (openBlock(), createBlock(_sfc_main$d, {
                                   key: 0,
-                                  "data-slot": "linkLabel",
-                                  class: ui.value.linkLabel({ class: [(_a5 = props.ui) == null ? void 0 : _a5.linkLabel, (_b4 = item.ui) == null ? void 0 : _b4.linkLabel] })
-                                }, [
-                                  renderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
-                                    createTextVNode(toDisplayString(getItemLabel(item)), 1)
-                                  ])
-                                ], 2)) : createCommentVNode("", true),
-                                item.trailingIcon || ((_c3 = item.children) == null ? void 0 : _c3.length) || !!slots[item.slot ? `${item.slot}-trailing` : "item-trailing"] ? (openBlock(), createBlock("span", {
+                                  name: item.icon,
+                                  "data-slot": "linkLeadingIcon",
+                                  class: ui.value.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon] })
+                                }, null, 8, ["name", "class"])) : item.children?.length ? (openBlock(), createBlock(_sfc_main$d, {
                                   key: 1,
-                                  "data-slot": "linkTrailing",
-                                  class: ui.value.linkTrailing({ class: [(_d3 = props.ui) == null ? void 0 : _d3.linkTrailing, (_e3 = item.ui) == null ? void 0 : _e3.linkTrailing] })
-                                }, [
-                                  renderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                                    var _a6, _b5, _c4, _d4, _e4, _f3;
-                                    return [
-                                      item.trailingIcon ? (openBlock(), createBlock(_sfc_main$d, {
-                                        key: 0,
-                                        name: item.trailingIcon,
-                                        "data-slot": "linkTrailingIcon",
-                                        class: ui.value.linkTrailingIcon({ class: [(_a6 = props.ui) == null ? void 0 : _a6.linkTrailingIcon, (_b5 = item.ui) == null ? void 0 : _b5.linkTrailingIcon] })
-                                      }, null, 8, ["name", "class"])) : ((_c4 = item.children) == null ? void 0 : _c4.length) ? (openBlock(), createBlock(_sfc_main$d, {
-                                        key: 1,
-                                        name: (_d4 = __props.trailingIcon) != null ? _d4 : unref(appConfig).ui.icons.chevronDown,
-                                        "data-slot": "linkTrailingIcon",
-                                        class: ui.value.linkTrailingIcon({ class: [(_e4 = props.ui) == null ? void 0 : _e4.linkTrailingIcon, (_f3 = item.ui) == null ? void 0 : _f3.linkTrailingIcon] })
-                                      }, null, 8, ["name", "class"])) : createCommentVNode("", true)
-                                    ];
-                                  })
-                                ], 2)) : createCommentVNode("", true)
-                              ];
-                            })
+                                  name: isExpanded ? __props.expandedIcon ?? unref(appConfig).ui.icons.folderOpen : __props.collapsedIcon ?? unref(appConfig).ui.icons.folder,
+                                  "data-slot": "linkLeadingIcon",
+                                  class: ui.value.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon] })
+                                }, null, 8, ["name", "class"])) : createCommentVNode("", true)
+                              ]),
+                              getItemLabel(item) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] ? (openBlock(), createBlock("span", {
+                                key: 0,
+                                "data-slot": "linkLabel",
+                                class: ui.value.linkLabel({ class: [props.ui?.linkLabel, item.ui?.linkLabel] })
+                              }, [
+                                renderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                                  createTextVNode(toDisplayString(getItemLabel(item)), 1)
+                                ])
+                              ], 2)) : createCommentVNode("", true),
+                              item.trailingIcon || item.children?.length || !!slots[item.slot ? `${item.slot}-trailing` : "item-trailing"] ? (openBlock(), createBlock("span", {
+                                key: 1,
+                                "data-slot": "linkTrailing",
+                                class: ui.value.linkTrailing({ class: [props.ui?.linkTrailing, item.ui?.linkTrailing] })
+                              }, [
+                                renderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                                  item.trailingIcon ? (openBlock(), createBlock(_sfc_main$d, {
+                                    key: 0,
+                                    name: item.trailingIcon,
+                                    "data-slot": "linkTrailingIcon",
+                                    class: ui.value.linkTrailingIcon({ class: [props.ui?.linkTrailingIcon, item.ui?.linkTrailingIcon] })
+                                  }, null, 8, ["name", "class"])) : item.children?.length ? (openBlock(), createBlock(_sfc_main$d, {
+                                    key: 1,
+                                    name: __props.trailingIcon ?? unref(appConfig).ui.icons.chevronDown,
+                                    "data-slot": "linkTrailingIcon",
+                                    class: ui.value.linkTrailingIcon({ class: [props.ui?.linkTrailingIcon, item.ui?.linkTrailingIcon] })
+                                  }, null, 8, ["name", "class"])) : createCommentVNode("", true)
+                                ])
+                              ], 2)) : createCommentVNode("", true)
+                            ])
                           ];
                         }
                       }),
                       _: 2
                     }), _parent3, _scopeId2);
                   }, _push3, _parent3, _scopeId2);
-                  if (nested.value && ((_a3 = item.children) == null ? void 0 : _a3.length) && isExpanded) {
-                    _push3(`<ul role="group" data-slot="listWithChildren" class="${ssrRenderClass(ui.value.listWithChildren({ class: [(_b2 = props.ui) == null ? void 0 : _b2.listWithChildren, (_c2 = item.ui) == null ? void 0 : _c2.listWithChildren] }))}"${_scopeId2}>`);
+                  if (nested.value && item.children?.length && isExpanded) {
+                    _push3(`<ul role="group" data-slot="listWithChildren" class="${ssrRenderClass(ui.value.listWithChildren({ class: [props.ui?.listWithChildren, item.ui?.listWithChildren] }))}"${_scopeId2}>`);
                     _push3(ssrRenderComponent(unref(ReuseTreeTemplate), {
                       items: item.children,
                       level: level + 1
@@ -1813,79 +1722,67 @@ const _sfc_main = /* @__PURE__ */ Object.assign({ inheritAttrs: false }, {
                   }
                 } else {
                   return [
-                    renderSlot(_ctx.$slots, item.slot ? `${item.slot}-wrapper` : "item-wrapper", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                      var _a4, _b3;
-                      return [
-                        (openBlock(), createBlock(resolveDynamicComponent(as.value.link), {
-                          type: as.value.link === "button" ? "button" : void 0,
-                          disabled: item.disabled || __props.disabled,
-                          "data-slot": "link",
-                          class: ui.value.link({ class: [(_a4 = props.ui) == null ? void 0 : _a4.link, (_b3 = item.ui) == null ? void 0 : _b3.link, item.class], selected: isSelected, disabled: item.disabled || __props.disabled }),
-                          style: !nested.value && level > 1 ? { paddingLeft: flattenedPaddingFormula.value(level) } : void 0
-                        }, {
-                          default: withCtx(() => [
-                            renderSlot(_ctx.$slots, item.slot || "item", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                              var _a5, _b4, _c3, _d3, _e3;
-                              return [
-                                renderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                                  var _a6, _b5, _c4, _d4, _e4, _f3, _g2;
-                                  return [
-                                    item.icon ? (openBlock(), createBlock(_sfc_main$d, {
-                                      key: 0,
-                                      name: item.icon,
-                                      "data-slot": "linkLeadingIcon",
-                                      class: ui.value.linkLeadingIcon({ class: [(_a6 = props.ui) == null ? void 0 : _a6.linkLeadingIcon, (_b5 = item.ui) == null ? void 0 : _b5.linkLeadingIcon] })
-                                    }, null, 8, ["name", "class"])) : ((_c4 = item.children) == null ? void 0 : _c4.length) ? (openBlock(), createBlock(_sfc_main$d, {
-                                      key: 1,
-                                      name: isExpanded ? (_d4 = __props.expandedIcon) != null ? _d4 : unref(appConfig).ui.icons.folderOpen : (_e4 = __props.collapsedIcon) != null ? _e4 : unref(appConfig).ui.icons.folder,
-                                      "data-slot": "linkLeadingIcon",
-                                      class: ui.value.linkLeadingIcon({ class: [(_f3 = props.ui) == null ? void 0 : _f3.linkLeadingIcon, (_g2 = item.ui) == null ? void 0 : _g2.linkLeadingIcon] })
-                                    }, null, 8, ["name", "class"])) : createCommentVNode("", true)
-                                  ];
-                                }),
-                                getItemLabel(item) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] ? (openBlock(), createBlock("span", {
+                    renderSlot(_ctx.$slots, item.slot ? `${item.slot}-wrapper` : "item-wrapper", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                      (openBlock(), createBlock(resolveDynamicComponent(as.value.link), {
+                        type: as.value.link === "button" ? "button" : void 0,
+                        disabled: item.disabled || __props.disabled,
+                        "data-slot": "link",
+                        class: ui.value.link({ class: [props.ui?.link, item.ui?.link, item.class], selected: isSelected, disabled: item.disabled || __props.disabled }),
+                        style: !nested.value && level > 1 ? { paddingLeft: flattenedPaddingFormula.value(level) } : void 0
+                      }, {
+                        default: withCtx(() => [
+                          renderSlot(_ctx.$slots, item.slot || "item", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                            renderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                              item.icon ? (openBlock(), createBlock(_sfc_main$d, {
+                                key: 0,
+                                name: item.icon,
+                                "data-slot": "linkLeadingIcon",
+                                class: ui.value.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon] })
+                              }, null, 8, ["name", "class"])) : item.children?.length ? (openBlock(), createBlock(_sfc_main$d, {
+                                key: 1,
+                                name: isExpanded ? __props.expandedIcon ?? unref(appConfig).ui.icons.folderOpen : __props.collapsedIcon ?? unref(appConfig).ui.icons.folder,
+                                "data-slot": "linkLeadingIcon",
+                                class: ui.value.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon] })
+                              }, null, 8, ["name", "class"])) : createCommentVNode("", true)
+                            ]),
+                            getItemLabel(item) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] ? (openBlock(), createBlock("span", {
+                              key: 0,
+                              "data-slot": "linkLabel",
+                              class: ui.value.linkLabel({ class: [props.ui?.linkLabel, item.ui?.linkLabel] })
+                            }, [
+                              renderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                                createTextVNode(toDisplayString(getItemLabel(item)), 1)
+                              ])
+                            ], 2)) : createCommentVNode("", true),
+                            item.trailingIcon || item.children?.length || !!slots[item.slot ? `${item.slot}-trailing` : "item-trailing"] ? (openBlock(), createBlock("span", {
+                              key: 1,
+                              "data-slot": "linkTrailing",
+                              class: ui.value.linkTrailing({ class: [props.ui?.linkTrailing, item.ui?.linkTrailing] })
+                            }, [
+                              renderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                                item.trailingIcon ? (openBlock(), createBlock(_sfc_main$d, {
                                   key: 0,
-                                  "data-slot": "linkLabel",
-                                  class: ui.value.linkLabel({ class: [(_a5 = props.ui) == null ? void 0 : _a5.linkLabel, (_b4 = item.ui) == null ? void 0 : _b4.linkLabel] })
-                                }, [
-                                  renderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
-                                    createTextVNode(toDisplayString(getItemLabel(item)), 1)
-                                  ])
-                                ], 2)) : createCommentVNode("", true),
-                                item.trailingIcon || ((_c3 = item.children) == null ? void 0 : _c3.length) || !!slots[item.slot ? `${item.slot}-trailing` : "item-trailing"] ? (openBlock(), createBlock("span", {
+                                  name: item.trailingIcon,
+                                  "data-slot": "linkTrailingIcon",
+                                  class: ui.value.linkTrailingIcon({ class: [props.ui?.linkTrailingIcon, item.ui?.linkTrailingIcon] })
+                                }, null, 8, ["name", "class"])) : item.children?.length ? (openBlock(), createBlock(_sfc_main$d, {
                                   key: 1,
-                                  "data-slot": "linkTrailing",
-                                  class: ui.value.linkTrailing({ class: [(_d3 = props.ui) == null ? void 0 : _d3.linkTrailing, (_e3 = item.ui) == null ? void 0 : _e3.linkTrailing] })
-                                }, [
-                                  renderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                                    var _a6, _b5, _c4, _d4, _e4, _f3;
-                                    return [
-                                      item.trailingIcon ? (openBlock(), createBlock(_sfc_main$d, {
-                                        key: 0,
-                                        name: item.trailingIcon,
-                                        "data-slot": "linkTrailingIcon",
-                                        class: ui.value.linkTrailingIcon({ class: [(_a6 = props.ui) == null ? void 0 : _a6.linkTrailingIcon, (_b5 = item.ui) == null ? void 0 : _b5.linkTrailingIcon] })
-                                      }, null, 8, ["name", "class"])) : ((_c4 = item.children) == null ? void 0 : _c4.length) ? (openBlock(), createBlock(_sfc_main$d, {
-                                        key: 1,
-                                        name: (_d4 = __props.trailingIcon) != null ? _d4 : unref(appConfig).ui.icons.chevronDown,
-                                        "data-slot": "linkTrailingIcon",
-                                        class: ui.value.linkTrailingIcon({ class: [(_e4 = props.ui) == null ? void 0 : _e4.linkTrailingIcon, (_f3 = item.ui) == null ? void 0 : _f3.linkTrailingIcon] })
-                                      }, null, 8, ["name", "class"])) : createCommentVNode("", true)
-                                    ];
-                                  })
-                                ], 2)) : createCommentVNode("", true)
-                              ];
-                            })
-                          ]),
-                          _: 2
-                        }, 1032, ["type", "disabled", "class", "style"]))
-                      ];
-                    }),
-                    nested.value && ((_d2 = item.children) == null ? void 0 : _d2.length) && isExpanded ? (openBlock(), createBlock("ul", {
+                                  name: __props.trailingIcon ?? unref(appConfig).ui.icons.chevronDown,
+                                  "data-slot": "linkTrailingIcon",
+                                  class: ui.value.linkTrailingIcon({ class: [props.ui?.linkTrailingIcon, item.ui?.linkTrailingIcon] })
+                                }, null, 8, ["name", "class"])) : createCommentVNode("", true)
+                              ])
+                            ], 2)) : createCommentVNode("", true)
+                          ])
+                        ]),
+                        _: 2
+                      }, 1032, ["type", "disabled", "class", "style"]))
+                    ]),
+                    nested.value && item.children?.length && isExpanded ? (openBlock(), createBlock("ul", {
                       key: 0,
                       role: "group",
                       "data-slot": "listWithChildren",
-                      class: ui.value.listWithChildren({ class: [(_e2 = props.ui) == null ? void 0 : _e2.listWithChildren, (_f2 = item.ui) == null ? void 0 : _f2.listWithChildren] })
+                      class: ui.value.listWithChildren({ class: [props.ui?.listWithChildren, item.ui?.listWithChildren] })
                     }, [
                       createVNode(unref(ReuseTreeTemplate), {
                         items: item.children,
@@ -1902,105 +1799,84 @@ const _sfc_main = /* @__PURE__ */ Object.assign({ inheritAttrs: false }, {
             return [
               createVNode("li", {
                 role: "presentation",
-                class: !!nested.value && level > 1 ? ui.value.itemWithChildren({ class: [(_e = props.ui) == null ? void 0 : _e.itemWithChildren, (_f = item.ui) == null ? void 0 : _f.itemWithChildren] }) : ui.value.item({ class: [(_g = props.ui) == null ? void 0 : _g.item, (_h = item.ui) == null ? void 0 : _h.item] })
+                class: !!nested.value && level > 1 ? ui.value.itemWithChildren({ class: [props.ui?.itemWithChildren, item.ui?.itemWithChildren] }) : ui.value.item({ class: [props.ui?.item, item.ui?.item] })
               }, [
                 createVNode(unref(TreeItem), {
                   level,
                   value: item,
                   "as-child": "",
-                  onToggle: ($event) => {
-                    var _a3, _b2;
-                    return (_b2 = (_a3 = item.onToggle) != null ? _a3 : props.onToggle) == null ? void 0 : _b2($event, item);
-                  },
-                  onSelect: ($event) => {
-                    var _a3, _b2;
-                    return (_b2 = (_a3 = item.onSelect) != null ? _a3 : props.onSelect) == null ? void 0 : _b2($event, item);
-                  }
+                  onToggle: ($event) => (item.onToggle ?? props.onToggle)?.($event, item),
+                  onSelect: ($event) => (item.onSelect ?? props.onSelect)?.($event, item)
                 }, {
-                  default: withCtx(({ isExpanded, isSelected, isIndeterminate, handleSelect, handleToggle }) => {
-                    var _a3, _b2, _c2;
-                    return [
-                      renderSlot(_ctx.$slots, item.slot ? `${item.slot}-wrapper` : "item-wrapper", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                        var _a4, _b3;
-                        return [
-                          (openBlock(), createBlock(resolveDynamicComponent(as.value.link), {
-                            type: as.value.link === "button" ? "button" : void 0,
-                            disabled: item.disabled || __props.disabled,
-                            "data-slot": "link",
-                            class: ui.value.link({ class: [(_a4 = props.ui) == null ? void 0 : _a4.link, (_b3 = item.ui) == null ? void 0 : _b3.link, item.class], selected: isSelected, disabled: item.disabled || __props.disabled }),
-                            style: !nested.value && level > 1 ? { paddingLeft: flattenedPaddingFormula.value(level) } : void 0
-                          }, {
-                            default: withCtx(() => [
-                              renderSlot(_ctx.$slots, item.slot || "item", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                                var _a5, _b4, _c3, _d2, _e2;
-                                return [
-                                  renderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                                    var _a6, _b5, _c4, _d3, _e3, _f2, _g2;
-                                    return [
-                                      item.icon ? (openBlock(), createBlock(_sfc_main$d, {
-                                        key: 0,
-                                        name: item.icon,
-                                        "data-slot": "linkLeadingIcon",
-                                        class: ui.value.linkLeadingIcon({ class: [(_a6 = props.ui) == null ? void 0 : _a6.linkLeadingIcon, (_b5 = item.ui) == null ? void 0 : _b5.linkLeadingIcon] })
-                                      }, null, 8, ["name", "class"])) : ((_c4 = item.children) == null ? void 0 : _c4.length) ? (openBlock(), createBlock(_sfc_main$d, {
-                                        key: 1,
-                                        name: isExpanded ? (_d3 = __props.expandedIcon) != null ? _d3 : unref(appConfig).ui.icons.folderOpen : (_e3 = __props.collapsedIcon) != null ? _e3 : unref(appConfig).ui.icons.folder,
-                                        "data-slot": "linkLeadingIcon",
-                                        class: ui.value.linkLeadingIcon({ class: [(_f2 = props.ui) == null ? void 0 : _f2.linkLeadingIcon, (_g2 = item.ui) == null ? void 0 : _g2.linkLeadingIcon] })
-                                      }, null, 8, ["name", "class"])) : createCommentVNode("", true)
-                                    ];
-                                  }),
-                                  getItemLabel(item) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] ? (openBlock(), createBlock("span", {
-                                    key: 0,
-                                    "data-slot": "linkLabel",
-                                    class: ui.value.linkLabel({ class: [(_a5 = props.ui) == null ? void 0 : _a5.linkLabel, (_b4 = item.ui) == null ? void 0 : _b4.linkLabel] })
-                                  }, [
-                                    renderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
-                                      createTextVNode(toDisplayString(getItemLabel(item)), 1)
-                                    ])
-                                  ], 2)) : createCommentVNode("", true),
-                                  item.trailingIcon || ((_c3 = item.children) == null ? void 0 : _c3.length) || !!slots[item.slot ? `${item.slot}-trailing` : "item-trailing"] ? (openBlock(), createBlock("span", {
-                                    key: 1,
-                                    "data-slot": "linkTrailing",
-                                    class: ui.value.linkTrailing({ class: [(_d2 = props.ui) == null ? void 0 : _d2.linkTrailing, (_e2 = item.ui) == null ? void 0 : _e2.linkTrailing] })
-                                  }, [
-                                    renderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => {
-                                      var _a6, _b5, _c4, _d3, _e3, _f2;
-                                      return [
-                                        item.trailingIcon ? (openBlock(), createBlock(_sfc_main$d, {
-                                          key: 0,
-                                          name: item.trailingIcon,
-                                          "data-slot": "linkTrailingIcon",
-                                          class: ui.value.linkTrailingIcon({ class: [(_a6 = props.ui) == null ? void 0 : _a6.linkTrailingIcon, (_b5 = item.ui) == null ? void 0 : _b5.linkTrailingIcon] })
-                                        }, null, 8, ["name", "class"])) : ((_c4 = item.children) == null ? void 0 : _c4.length) ? (openBlock(), createBlock(_sfc_main$d, {
-                                          key: 1,
-                                          name: (_d3 = __props.trailingIcon) != null ? _d3 : unref(appConfig).ui.icons.chevronDown,
-                                          "data-slot": "linkTrailingIcon",
-                                          class: ui.value.linkTrailingIcon({ class: [(_e3 = props.ui) == null ? void 0 : _e3.linkTrailingIcon, (_f2 = item.ui) == null ? void 0 : _f2.linkTrailingIcon] })
-                                        }, null, 8, ["name", "class"])) : createCommentVNode("", true)
-                                      ];
-                                    })
-                                  ], 2)) : createCommentVNode("", true)
-                                ];
-                              })
+                  default: withCtx(({ isExpanded, isSelected, isIndeterminate, handleSelect, handleToggle }) => [
+                    renderSlot(_ctx.$slots, item.slot ? `${item.slot}-wrapper` : "item-wrapper", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                      (openBlock(), createBlock(resolveDynamicComponent(as.value.link), {
+                        type: as.value.link === "button" ? "button" : void 0,
+                        disabled: item.disabled || __props.disabled,
+                        "data-slot": "link",
+                        class: ui.value.link({ class: [props.ui?.link, item.ui?.link, item.class], selected: isSelected, disabled: item.disabled || __props.disabled }),
+                        style: !nested.value && level > 1 ? { paddingLeft: flattenedPaddingFormula.value(level) } : void 0
+                      }, {
+                        default: withCtx(() => [
+                          renderSlot(_ctx.$slots, item.slot || "item", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                            renderSlot(_ctx.$slots, item.slot ? `${item.slot}-leading` : "item-leading", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                              item.icon ? (openBlock(), createBlock(_sfc_main$d, {
+                                key: 0,
+                                name: item.icon,
+                                "data-slot": "linkLeadingIcon",
+                                class: ui.value.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon] })
+                              }, null, 8, ["name", "class"])) : item.children?.length ? (openBlock(), createBlock(_sfc_main$d, {
+                                key: 1,
+                                name: isExpanded ? __props.expandedIcon ?? unref(appConfig).ui.icons.folderOpen : __props.collapsedIcon ?? unref(appConfig).ui.icons.folder,
+                                "data-slot": "linkLeadingIcon",
+                                class: ui.value.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon] })
+                              }, null, 8, ["name", "class"])) : createCommentVNode("", true)
                             ]),
-                            _: 2
-                          }, 1032, ["type", "disabled", "class", "style"]))
-                        ];
-                      }),
-                      nested.value && ((_a3 = item.children) == null ? void 0 : _a3.length) && isExpanded ? (openBlock(), createBlock("ul", {
-                        key: 0,
-                        role: "group",
-                        "data-slot": "listWithChildren",
-                        class: ui.value.listWithChildren({ class: [(_b2 = props.ui) == null ? void 0 : _b2.listWithChildren, (_c2 = item.ui) == null ? void 0 : _c2.listWithChildren] })
-                      }, [
-                        createVNode(unref(ReuseTreeTemplate), {
-                          items: item.children,
-                          level: level + 1
-                        }, null, 8, ["items", "level"])
-                      ], 2)) : createCommentVNode("", true)
-                    ];
-                  }),
+                            getItemLabel(item) || !!slots[item.slot ? `${item.slot}-label` : "item-label"] ? (openBlock(), createBlock("span", {
+                              key: 0,
+                              "data-slot": "linkLabel",
+                              class: ui.value.linkLabel({ class: [props.ui?.linkLabel, item.ui?.linkLabel] })
+                            }, [
+                              renderSlot(_ctx.$slots, item.slot ? `${item.slot}-label` : "item-label", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                                createTextVNode(toDisplayString(getItemLabel(item)), 1)
+                              ])
+                            ], 2)) : createCommentVNode("", true),
+                            item.trailingIcon || item.children?.length || !!slots[item.slot ? `${item.slot}-trailing` : "item-trailing"] ? (openBlock(), createBlock("span", {
+                              key: 1,
+                              "data-slot": "linkTrailing",
+                              class: ui.value.linkTrailing({ class: [props.ui?.linkTrailing, item.ui?.linkTrailing] })
+                            }, [
+                              renderSlot(_ctx.$slots, item.slot ? `${item.slot}-trailing` : "item-trailing", mergeProps({ index, level, expanded: isExpanded, selected: isSelected, indeterminate: isIndeterminate, handleSelect, handleToggle, ui: ui.value }, { item }), () => [
+                                item.trailingIcon ? (openBlock(), createBlock(_sfc_main$d, {
+                                  key: 0,
+                                  name: item.trailingIcon,
+                                  "data-slot": "linkTrailingIcon",
+                                  class: ui.value.linkTrailingIcon({ class: [props.ui?.linkTrailingIcon, item.ui?.linkTrailingIcon] })
+                                }, null, 8, ["name", "class"])) : item.children?.length ? (openBlock(), createBlock(_sfc_main$d, {
+                                  key: 1,
+                                  name: __props.trailingIcon ?? unref(appConfig).ui.icons.chevronDown,
+                                  "data-slot": "linkTrailingIcon",
+                                  class: ui.value.linkTrailingIcon({ class: [props.ui?.linkTrailingIcon, item.ui?.linkTrailingIcon] })
+                                }, null, 8, ["name", "class"])) : createCommentVNode("", true)
+                              ])
+                            ], 2)) : createCommentVNode("", true)
+                          ])
+                        ]),
+                        _: 2
+                      }, 1032, ["type", "disabled", "class", "style"]))
+                    ]),
+                    nested.value && item.children?.length && isExpanded ? (openBlock(), createBlock("ul", {
+                      key: 0,
+                      role: "group",
+                      "data-slot": "listWithChildren",
+                      class: ui.value.listWithChildren({ class: [props.ui?.listWithChildren, item.ui?.listWithChildren] })
+                    }, [
+                      createVNode(unref(ReuseTreeTemplate), {
+                        items: item.children,
+                        level: level + 1
+                      }, null, 8, ["items", "level"])
+                    ], 2)) : createCommentVNode("", true)
+                  ]),
                   _: 2
                 }, 1032, ["level", "value", "onToggle", "onSelect"])
               ], 2)
@@ -2045,7 +1921,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({ inheritAttrs: false }, {
         "model-value": __props.modelValue,
         "default-value": __props.defaultValue,
         "data-slot": "root",
-        class: ui.value.root({ class: [(_a = props.ui) == null ? void 0 : _a.root, props.class] }),
+        class: ui.value.root({ class: [props.ui?.root, props.class] }),
         "get-key": getItemKey,
         "default-expanded": defaultExpanded.value,
         "selection-behavior": __props.selectionBehavior