@k2b/ui 0.44.0 → 0.45.0

package/dist/ssr/layout/AppWorkspace.js

@@ -15,8 +15,8 @@ var _tmpl$ = ["<button type=\"button\" class=\"k2b-app-workspace__resize\" role=
   _tmpl$6 = ["<style>", "</style>"],
   _tmpl$7 = ["<div class=\"k2b-app-workspace__main-primary\" data-workspace-main-region=\"main\"", ">", "</div>"],
   _tmpl$8 = ["<section", " class=\"", "\"", " style=\"", "\">", "</section>"],
-  _tmpl$9 = "<i class=\"ti ti-chevron-left\" aria-hidden=\"true\"></i>",
-  _tmpl$0 = ["<div class=\"k2b-app-workspace__level-body\"", ">", "</div>"],
+  _tmpl$9 = ["<div class=\"k2b-app-workspace__level-body\"", ">", "</div>"],
+  _tmpl$0 = "<i class=\"ti ti-chevron-left\" aria-hidden=\"true\"></i>",
   _tmpl$1 = "<i class=\"ti ti-layout-sidebar-right\" aria-hidden=\"true\"></i>",
   _tmpl$10 = ["<aside", " class=\"", "\"", "", " style=\"", "\"><button type=\"button\" class=\"k2b-app-workspace__detail-grabber\"", " aria-pressed=\"false\"><span aria-hidden=\"true\"></span></button>", "</aside>"],
   _tmpl$11 = ["<aside", " class=\"", "\"", "", " style=\"", "\">", "</aside>"],
@@ -426,7 +426,7 @@ function AppWorkspaceMain(props) {
                 get children() {
                   return handle();
                 }
-              }), _$ssr(_tmpl$8, _$ssrAttribute("id", _$escape(pane.domId, true), false), `k2b-app-workspace__main-pane ${isAnchor() ? "is-primary" : ""} ${_$escape(pane.props.class ?? "", true)}`, _$ssrAttribute("aria-label", _$escape(pane.props.label, true), false) + _$ssrAttribute("data-workspace-level", levelsMode() ? _$escape(levelIndex(), true) : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-level-shown", _$escape(levelAttr("shown"), true), false) + _$ssrAttribute("data-workspace-level-first", _$escape(levelAttr("first"), true), false) + _$ssrAttribute("data-workspace-level-last", _$escape(levelAttr("last"), true), false) + _$ssrAttribute("data-workspace-main-region", _$escape(pane.props.id, true), false) + _$ssrAttribute("data-workspace-mobile-active", (levelsMode() ? levelClasses(levelIndex(), "shown").split(" ").includes("1") : activeMobilePane() === pane.props.id) ? "true" : "false", false) + _$ssrAttribute("data-workspace-panel-id", _$escape(panelId, true), false) + _$ssrAttribute("data-workspace-resizable", resizable() ? "true" : "false", false) + _$ssrAttribute("data-surface", pane.props.surface === "navigation" ? "navigation" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll", !levelsMode() && pane.props.scroll === false ? "false" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-fade-mode", !levelsMode() && pane.props.scroll !== false && pane.props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$ssrStyle(nonEmptyStyle({
+              }), _$ssr(_tmpl$8, _$ssrAttribute("id", _$escape(pane.domId, true), false), `k2b-app-workspace__main-pane ${isAnchor() ? "is-primary" : ""} ${_$escape(pane.props.class ?? "", true)}`, _$ssrAttribute("aria-label", _$escape(pane.props.label, true), false) + _$ssrAttribute("data-workspace-level", levelsMode() ? _$escape(levelIndex(), true) : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-level-shown", _$escape(levelAttr("shown"), true), false) + _$ssrAttribute("data-workspace-level-first", _$escape(levelAttr("first"), true), false) + _$ssrAttribute("data-workspace-level-last", _$escape(levelAttr("last"), true), false) + _$ssrAttribute("data-workspace-main-region", _$escape(pane.props.id, true), false) + _$ssrAttribute("data-workspace-heading", levelsMode() ? _$escape(pane.props.heading, true) : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-mobile-active", (levelsMode() ? levelClasses(levelIndex(), "shown").split(" ").includes("1") : activeMobilePane() === pane.props.id) ? "true" : "false", false) + _$ssrAttribute("data-workspace-panel-id", _$escape(panelId, true), false) + _$ssrAttribute("data-workspace-resizable", resizable() ? "true" : "false", false) + _$ssrAttribute("data-surface", pane.props.surface === "navigation" ? "navigation" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll", !levelsMode() && pane.props.scroll === false ? "false" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-fade-mode", !levelsMode() && pane.props.scroll !== false && pane.props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$ssrStyle(nonEmptyStyle({
                 ...(isAnchor() ? {} : {
                   // A stored width keeps to this pane's limits before the controller attaches.
                   "--k2b-workspace-panel-size": `clamp(${minSize()}px, var(${variable}, ${appWorkspaceWidthCss(defaultSize(), "var(--k2b-workspace-width)")}), ${maxSize()}px)`,
@@ -453,33 +453,54 @@ function AppWorkspaceMain(props) {
                 get children() {
                   return _$createComponent(Show, {
                     get when() {
-                      return _$memo(() => levelIndex() > 1)() && depth() > 1;
+                      return pane.props.back;
                     },
-                    get children() {
-                      return _$createComponent(IconButtonLink, {
-                        "class": "k2b-app-workspace__level-back",
-                        get href() {
-                          return levels()[depth() - 2]?.props.href;
-                        },
-                        get label() {
-                          return workspaceMessages().backTo({
-                            page: levels()[levelIndex() - 2]?.props.label ?? ""
-                          });
-                        },
-                        get navigation() {
-                          return props.onLevelNavigate ? "enhanced" : "document";
-                        },
-                        get onNavigate() {
-                          return props.onLevelNavigate ? navigateBack : undefined;
+                    get fallback() {
+                      return _$createComponent(Show, {
+                        get when() {
+                          return _$memo(() => levelIndex() > 1)() && depth() > 1;
                         },
                         get children() {
-                          return _$ssr(_tmpl$9);
+                          return _$createComponent(IconButtonLink, {
+                            "class": "k2b-app-workspace__level-back",
+                            get href() {
+                              return levels()[depth() - 2]?.props.href;
+                            },
+                            get label() {
+                              return workspaceMessages().backTo({
+                                page: levels()[levelIndex() - 2]?.props.label ?? ""
+                              });
+                            },
+                            get navigation() {
+                              return props.onLevelNavigate ? "enhanced" : "document";
+                            },
+                            get onNavigate() {
+                              return props.onLevelNavigate ? navigateBack : undefined;
+                            },
+                            get children() {
+                              return _$ssr(_tmpl$0);
+                            }
+                          });
                         }
                       });
-                    }
+                    },
+                    children: back => _$createComponent(IconButtonLink, {
+                      "class": "k2b-app-workspace__level-back k2b-app-workspace__level-back--own",
+                      get href() {
+                        return back().href;
+                      },
+                      get label() {
+                        return workspaceMessages().backTo({
+                          page: back().label
+                        });
+                      },
+                      get children() {
+                        return _$ssr(_tmpl$0);
+                      }
+                    })
                   });
                 }
-              }), _$ssr(_tmpl$0, _$ssrAttribute("data-scroll", pane.props.scroll === false ? "false" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-fade-mode", pane.props.scroll !== false && pane.props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$escape(pane.props.children))]) : _$escape(pane.props.children)), _$createComponent(Show, {
+              }), _$ssr(_tmpl$9, _$ssrAttribute("data-scroll", pane.props.scroll === false ? "false" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-fade-mode", pane.props.scroll !== false && pane.props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$escape(pane.props.children))]) : _$escape(pane.props.children)), _$createComponent(Show, {
                 get when() {
                   return _$memo(() => !!resizable())() && before();
                 },