@k2b/ui 0.10.0 → 0.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/browser/feedback/HoverPreview.js +6 -6
- package/dist/browser/feedback/HoverPreview.js.map +1 -1
- package/dist/browser/layout/AppWorkspace.js +105 -77
- package/dist/browser/layout/AppWorkspace.js.map +1 -1
- package/dist/browser/layout/app-workspace-controller.js +30 -2
- package/dist/browser/layout/app-workspace-controller.js.map +1 -1
- package/dist/ssr/feedback/HoverPreview.js +6 -6
- package/dist/ssr/feedback/HoverPreview.js.map +1 -1
- package/dist/ssr/layout/AppWorkspace.js +84 -66
- package/dist/ssr/layout/AppWorkspace.js.map +1 -1
- package/dist/ssr/layout/app-workspace-controller.js +30 -2
- package/dist/ssr/layout/app-workspace-controller.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/types/layout/AppWorkspace.d.ts +14 -0
- package/dist/types/layout/app-workspace-controller.d.ts +5 -0
- package/package.json +1 -1
|
@@ -11,40 +11,41 @@ var _tmpl$ = ["<button type=\"button\" class=\"k2b-app-workspace__resize\" role=
|
|
|
11
11
|
_tmpl$2 = ["<div class=\"k2b-app-workspace__main-primary\" data-workspace-main-region=\"main\"", ">", "</div>"],
|
|
12
12
|
_tmpl$3 = ["<section", " class=\"", "\"", " style=\"", "\">", "</section>"],
|
|
13
13
|
_tmpl$4 = ["<aside", " class=\"", "\"", "", " style=\"", "\">", "</aside>"],
|
|
14
|
-
_tmpl$5 = ["<
|
|
15
|
-
_tmpl$6 = ["<
|
|
16
|
-
_tmpl$7 = ["<
|
|
17
|
-
_tmpl$8 = ["<span
|
|
18
|
-
_tmpl$9 = ["<
|
|
19
|
-
_tmpl$0 = ["<
|
|
20
|
-
_tmpl$1 = ["<
|
|
21
|
-
_tmpl$10 = ["<
|
|
22
|
-
_tmpl$11 = ["<
|
|
23
|
-
_tmpl$12 = ["<
|
|
24
|
-
_tmpl$13 = ["<
|
|
25
|
-
_tmpl$14 = ["<span class=\"k2b-app-workspace__sidebar-item-
|
|
26
|
-
_tmpl$15 = ["<span class=\"k2b-app-workspace__sidebar-item-context
|
|
27
|
-
_tmpl$16 = ["<span class=\"k2b-app-workspace__sidebar-item-
|
|
28
|
-
_tmpl$17 = ["<span class=\"k2b-app-workspace__sidebar-item-
|
|
29
|
-
_tmpl$18 = ["<
|
|
30
|
-
_tmpl$19 = ["<
|
|
31
|
-
_tmpl$20 = ["<
|
|
32
|
-
_tmpl$21 = ["<
|
|
33
|
-
_tmpl$22 = ["<
|
|
34
|
-
_tmpl$23 = ["<span class=\"k2b-app-workspace__sidebar-item-
|
|
35
|
-
_tmpl$24 = ["<span class=\""
|
|
36
|
-
_tmpl$25 = ["<span class=\"
|
|
37
|
-
_tmpl$26 = ["<
|
|
38
|
-
_tmpl$27 = ["<div class=\"k2b-app-workspace__nav-tree-
|
|
39
|
-
_tmpl$28 = ["<div class=\"
|
|
40
|
-
_tmpl$29 = ["<div class=\"
|
|
41
|
-
_tmpl$30 = ["<
|
|
42
|
-
_tmpl$31 = ["<
|
|
43
|
-
_tmpl$32 = ["<div class=\"", "\">", "</div>"]
|
|
14
|
+
_tmpl$5 = ["<div class=\"k2b-app-workspace__sidebar-desktop\">", "</div>"],
|
|
15
|
+
_tmpl$6 = ["<aside", " class=\"", "\"", "", ">", "</aside>"],
|
|
16
|
+
_tmpl$7 = ["<script>", "</script>"],
|
|
17
|
+
_tmpl$8 = ["<span aria-hidden=\"true\"><i", "></i></span>"],
|
|
18
|
+
_tmpl$9 = ["<span class=\"k2b-app-workspace__sidebar-section-count\">", "</span>"],
|
|
19
|
+
_tmpl$0 = ["<button type=\"button\" class=\"k2b-app-workspace__sidebar-section-toggle\"", ">", "<i", " aria-hidden=\"true\"></i></button>"],
|
|
20
|
+
_tmpl$1 = ["<div class=\"k2b-app-workspace__sidebar-section-actions\">", "</div>"],
|
|
21
|
+
_tmpl$10 = ["<header class=\"k2b-app-workspace__sidebar-section-header\">", "", "</header>"],
|
|
22
|
+
_tmpl$11 = ["<div", "", " class=\"k2b-app-workspace__sidebar-section-content\">", "</div>"],
|
|
23
|
+
_tmpl$12 = ["<h2>", "</h2>"],
|
|
24
|
+
_tmpl$13 = ["<div class=\"k2b-app-workspace__sidebar-item-actions\"", ">", "</div>"],
|
|
25
|
+
_tmpl$14 = ["<span class=\"k2b-app-workspace__sidebar-item-icon\" aria-hidden=\"true\">", "</span>"],
|
|
26
|
+
_tmpl$15 = ["<span class=\"k2b-app-workspace__sidebar-item-context-meta\">", "</span>"],
|
|
27
|
+
_tmpl$16 = ["<span class=\"k2b-app-workspace__sidebar-item-context\"><span class=\"k2b-app-workspace__sidebar-item-context-label\">", "</span>", "</span>"],
|
|
28
|
+
_tmpl$17 = ["<span class=\"k2b-app-workspace__sidebar-item-description\">", "</span>"],
|
|
29
|
+
_tmpl$18 = ["<span class=\"k2b-app-workspace__sidebar-item-copy\">", "<span class=\"k2b-app-workspace__sidebar-item-label\"", "><span class=\"k2b-app-workspace__sidebar-item-label-text\">", "</span></span>", "</span>"],
|
|
30
|
+
_tmpl$19 = ["<i", "></i>"],
|
|
31
|
+
_tmpl$20 = ["<span class=\"k2b-app-workspace__sidebar-item-meta\"", ">", "</span>"],
|
|
32
|
+
_tmpl$21 = ["<a", " class=\"k2b-app-workspace__sidebar-item-action\"", ">", "</a>"],
|
|
33
|
+
_tmpl$22 = ["<button type=\"button\" class=\"k2b-app-workspace__sidebar-item-action\"", ">", "</button>"],
|
|
34
|
+
_tmpl$23 = ["<span class=\"k2b-app-workspace__sidebar-item-icon\"", " aria-hidden=\"true\"><i", "></i></span>"],
|
|
35
|
+
_tmpl$24 = ["<span class=\"k2b-app-workspace__sidebar-item-label\"><span class=\"k2b-app-workspace__sidebar-item-label-text\">", "</span></span>"],
|
|
36
|
+
_tmpl$25 = ["<span class=\"", "\"", ">", "</span>"],
|
|
37
|
+
_tmpl$26 = ["<span class=\"k2b-app-workspace__nav-tree-toggle\" data-k2b-nav-tree-toggle aria-hidden=\"true\"><i class=\"", "\"></i></span>"],
|
|
38
|
+
_tmpl$27 = ["<div class=\"k2b-app-workspace__nav-tree-group\" role=\"group\">", "</div>"],
|
|
39
|
+
_tmpl$28 = ["<div class=\"k2b-app-workspace__nav-tree-node\" role=\"treeitem\"", ">", "", "</div>"],
|
|
40
|
+
_tmpl$29 = ["<div class=\"", "\" role=\"tree\"", ">", "</div>"],
|
|
41
|
+
_tmpl$30 = ["<div class=\"k2b-app-workspace__sidebar-icon-grid\"", ">", "</div>"],
|
|
42
|
+
_tmpl$31 = ["<i", " aria-hidden=\"true\"></i>"],
|
|
43
|
+
_tmpl$32 = ["<div class=\"", "\" data-k2b-app-workspace", " style=\"", "\">", "</div>"],
|
|
44
|
+
_tmpl$33 = ["<div class=\"", "\">", "</div>"];
|
|
44
45
|
import { Link } from "@k2b/ssr/nav";
|
|
45
46
|
import { children, createContext, createMemo, createSignal, createUniqueId, For, mergeProps, onCleanup, onMount, Show, useContext } from "solid-js";
|
|
46
47
|
import { useUiMessages } from "../intl/messages";
|
|
47
|
-
import { installAppWorkspaceController } from "./app-workspace-controller";
|
|
48
|
+
import { APP_WORKSPACE_SIDEBAR_HIDE_EVENT, installAppWorkspaceController } from "./app-workspace-controller";
|
|
48
49
|
import { APP_WORKSPACE_DETAIL_DEFAULT, APP_WORKSPACE_DETAIL_MAX, APP_WORKSPACE_DETAIL_MIN, APP_WORKSPACE_DRAWER_DEFAULT, APP_WORKSPACE_DRAWER_MAX, APP_WORKSPACE_DRAWER_MIN, APP_WORKSPACE_PANE_DEFAULT, APP_WORKSPACE_PANE_MAX, APP_WORKSPACE_PANE_MIN, APP_WORKSPACE_SIDEBAR_COLLAPSED, APP_WORKSPACE_SIDEBAR_DEFAULT, APP_WORKSPACE_SIDEBAR_MAX, APP_WORKSPACE_SIDEBAR_MIN, appWorkspaceLayoutStyle, appWorkspacePanelVariable } from "./app-workspace-state";
|
|
49
50
|
import { SidebarItemPreview } from "./SidebarItemPreview";
|
|
50
51
|
import { createScrollFade } from "./scroll-fade";
|
|
@@ -336,19 +337,36 @@ function AppWorkspaceSidebar(props) {
|
|
|
336
337
|
const minSize = () => props.minSize ?? (props.collapsible ? APP_WORKSPACE_SIDEBAR_COLLAPSED : APP_WORKSPACE_SIDEBAR_MIN);
|
|
337
338
|
const maxSize = () => props.maxSize ?? APP_WORKSPACE_SIDEBAR_MAX;
|
|
338
339
|
const generatedId = createUniqueId();
|
|
339
|
-
const domId = `k2b-workspace-sidebar-${generatedId}`;
|
|
340
|
-
|
|
340
|
+
const domId = () => props.id ?? `k2b-workspace-sidebar-${generatedId}`;
|
|
341
|
+
// Hidden navigation is not rendered at all, so its labels are neither shown
|
|
342
|
+
// nor reachable; reading the children lazily keeps them from being created.
|
|
343
|
+
const resolved = children(() => props.hidden ? undefined : props.children);
|
|
341
344
|
const slots = createMemo(() => flatten(resolved()).filter(sidebarChildSlot));
|
|
342
345
|
const desktop = createMemo(() => slots().find(slot => slot.kind === SIDEBAR_DESKTOP));
|
|
343
|
-
|
|
346
|
+
let aside;
|
|
347
|
+
onMount(() => {
|
|
348
|
+
const requestHide = () => props.onHiddenChange?.(true);
|
|
349
|
+
aside?.addEventListener(APP_WORKSPACE_SIDEBAR_HIDE_EVENT, requestHide);
|
|
350
|
+
onCleanup(() => aside?.removeEventListener(APP_WORKSPACE_SIDEBAR_HIDE_EVENT, requestHide));
|
|
351
|
+
});
|
|
352
|
+
return [_$ssr(_tmpl$6, _$ssrAttribute("id", _$escape(domId(), true), false), `k2b-app-workspace__sidebar ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("aria-label", _$escape(props.label, true), false), _$ssrAttribute("hidden", props.hidden || undefined, true) + _$ssrAttribute("data-mobile", props.mobile === "stacked" ? "stacked" : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-resizable", resizable() ? "true" : "false", false) + _$ssrAttribute("data-workspace-collapsible", props.collapsible ? "true" : "false", false) + _$ssrAttribute("data-workspace-hideable", props.onHiddenChange ? "true" : _$escape(undefined, true), false), _$escape(_$createComponent(Show, {
|
|
344
353
|
get when() {
|
|
345
|
-
return
|
|
354
|
+
return !props.hidden;
|
|
355
|
+
},
|
|
356
|
+
get children() {
|
|
357
|
+
return _$ssr(_tmpl$5, _$escape(desktop()?.children));
|
|
358
|
+
}
|
|
359
|
+
}))), _$createComponent(Show, {
|
|
360
|
+
get when() {
|
|
361
|
+
return _$memo(() => !!resizable())() && !props.hidden;
|
|
346
362
|
},
|
|
347
363
|
get children() {
|
|
348
364
|
return _$createComponent(ResizeHandle, {
|
|
349
365
|
kind: "sidebar",
|
|
350
366
|
edge: "end",
|
|
351
|
-
controls
|
|
367
|
+
get controls() {
|
|
368
|
+
return domId();
|
|
369
|
+
},
|
|
352
370
|
get defaultSize() {
|
|
353
371
|
return defaultSize();
|
|
354
372
|
},
|
|
@@ -390,7 +408,7 @@ const AppWorkspaceSidebarBody = props => {
|
|
|
390
408
|
get ["data-scroll-fade-mode"]() {
|
|
391
409
|
return props.scrollFade !== false ? "both" : undefined;
|
|
392
410
|
}
|
|
393
|
-
}, () => scrollAttrs(props.scrollPreserveKey), () => modeAttrs(props.sidebarMode)), _$escape(props.children), false), _$ssr(_tmpl$
|
|
411
|
+
}, () => scrollAttrs(props.scrollPreserveKey), () => modeAttrs(props.sidebarMode)), _$escape(props.children), false), _$ssr(_tmpl$7, SIDEBAR_SCROLL_MEMORY_SCRIPT)];
|
|
394
412
|
};
|
|
395
413
|
const AppWorkspaceSidebarFooter = props => _$ssrElement("footer", _$mergeProps({
|
|
396
414
|
get ["class"]() {
|
|
@@ -406,14 +424,14 @@ const AppWorkspaceSidebarSection = props => {
|
|
|
406
424
|
return props.icon;
|
|
407
425
|
},
|
|
408
426
|
get children() {
|
|
409
|
-
return _$ssr(_tmpl$
|
|
427
|
+
return _$ssr(_tmpl$8, _$ssrAttribute("class", _$escape(iconClass(props.icon), true), false));
|
|
410
428
|
}
|
|
411
429
|
}), props.title, _$createComponent(Show, {
|
|
412
430
|
get when() {
|
|
413
431
|
return props.count !== undefined;
|
|
414
432
|
},
|
|
415
433
|
get children() {
|
|
416
|
-
return _$ssr(_tmpl$
|
|
434
|
+
return _$ssr(_tmpl$9, _$escape(props.count));
|
|
417
435
|
}
|
|
418
436
|
})];
|
|
419
437
|
return _$ssrElement("section", _$mergeProps({
|
|
@@ -428,7 +446,7 @@ const AppWorkspaceSidebarSection = props => {
|
|
|
428
446
|
return props.title || props.actions;
|
|
429
447
|
},
|
|
430
448
|
get children() {
|
|
431
|
-
return _$ssr(_tmpl$
|
|
449
|
+
return _$ssr(_tmpl$10, _$escape(_$createComponent(Show, {
|
|
432
450
|
get when() {
|
|
433
451
|
return props.collapsible;
|
|
434
452
|
},
|
|
@@ -438,23 +456,23 @@ const AppWorkspaceSidebarSection = props => {
|
|
|
438
456
|
return props.title;
|
|
439
457
|
},
|
|
440
458
|
get children() {
|
|
441
|
-
return _$ssr(_tmpl$
|
|
459
|
+
return _$ssr(_tmpl$12, _$escape(title()));
|
|
442
460
|
}
|
|
443
461
|
});
|
|
444
462
|
},
|
|
445
463
|
get children() {
|
|
446
|
-
return _$ssr(_tmpl$
|
|
464
|
+
return _$ssr(_tmpl$0, _$ssrAttribute("aria-expanded", _$escape(open(), true), false) + _$ssrAttribute("aria-controls", _$escape(id, true), false), _$escape(title()), _$ssrAttribute("class", open() ? "ti ti-chevron-down" : "ti ti-chevron-right", false));
|
|
447
465
|
}
|
|
448
466
|
})), _$escape(_$createComponent(Show, {
|
|
449
467
|
get when() {
|
|
450
468
|
return props.actions;
|
|
451
469
|
},
|
|
452
470
|
get children() {
|
|
453
|
-
return _$ssr(_tmpl$
|
|
471
|
+
return _$ssr(_tmpl$1, _$escape(props.actions));
|
|
454
472
|
}
|
|
455
473
|
})));
|
|
456
474
|
}
|
|
457
|
-
})), _$ssr(_tmpl$
|
|
475
|
+
})), _$ssr(_tmpl$11, _$ssrAttribute("id", _$escape(id, true), false), _$ssrAttribute("hidden", !open(), true), _$escape(props.children))], false);
|
|
458
476
|
};
|
|
459
477
|
const AppWorkspaceSidebarItemIcon = props => mergeProps({
|
|
460
478
|
kind: SIDEBAR_ITEM_ICON
|
|
@@ -468,7 +486,7 @@ const AppWorkspaceSidebarItemMeta = props => mergeProps({
|
|
|
468
486
|
const AppWorkspaceSidebarItemAction = props => mergeProps({
|
|
469
487
|
kind: SIDEBAR_ITEM_ACTION
|
|
470
488
|
}, props);
|
|
471
|
-
const AppWorkspaceSidebarItemActions = props => _$ssr(_tmpl$
|
|
489
|
+
const AppWorkspaceSidebarItemActions = props => _$ssr(_tmpl$13, _$ssrAttribute("data-visibility", props.visibility === "hover" ? "hover" : _$escape(undefined, true), false), _$escape(props.children));
|
|
472
490
|
/** Shared visual and semantic row frame for flat sidebar items and tree items. */
|
|
473
491
|
function AppWorkspaceSidebarRow(props) {
|
|
474
492
|
const className = () => `k2b-app-workspace__sidebar-item ${props.hasActions ? "has-action" : ""} ${props.active ? props.activeClass ?? "is-active" : ""} ${props.class ?? ""}`;
|
|
@@ -600,19 +618,19 @@ function AppWorkspaceSidebarItem(props) {
|
|
|
600
618
|
return iconContent() || icon();
|
|
601
619
|
},
|
|
602
620
|
get children() {
|
|
603
|
-
return _$ssr(_tmpl$
|
|
621
|
+
return _$ssr(_tmpl$14, _$escape(iconContent() ?? _$ssr(_tmpl$19, _$ssrAttribute("class", _$escape(iconClass(icon()), true), false))));
|
|
604
622
|
}
|
|
605
|
-
}), _$ssr(_tmpl$
|
|
623
|
+
}), _$ssr(_tmpl$18, _$escape(_$createComponent(Show, {
|
|
606
624
|
get when() {
|
|
607
625
|
return props.context || props.contextMeta;
|
|
608
626
|
},
|
|
609
627
|
get children() {
|
|
610
|
-
return _$ssr(_tmpl$
|
|
628
|
+
return _$ssr(_tmpl$16, _$escape(props.context), _$escape(_$createComponent(Show, {
|
|
611
629
|
get when() {
|
|
612
630
|
return props.contextMeta;
|
|
613
631
|
},
|
|
614
632
|
get children() {
|
|
615
|
-
return _$ssr(_tmpl$
|
|
633
|
+
return _$ssr(_tmpl$15, _$escape(props.contextMeta));
|
|
616
634
|
}
|
|
617
635
|
})));
|
|
618
636
|
}
|
|
@@ -621,13 +639,13 @@ function AppWorkspaceSidebarItem(props) {
|
|
|
621
639
|
return props.description;
|
|
622
640
|
},
|
|
623
641
|
get children() {
|
|
624
|
-
return _$ssr(_tmpl$
|
|
642
|
+
return _$ssr(_tmpl$17, _$escape(props.description));
|
|
625
643
|
}
|
|
626
644
|
}))), _$createComponent(Show, {
|
|
627
645
|
get when() {
|
|
628
646
|
return meta();
|
|
629
647
|
},
|
|
630
|
-
children: value => _$ssr(_tmpl$
|
|
648
|
+
children: value => _$ssr(_tmpl$20, _$ssrAttribute("data-visibility", metaVisibility() === "hover" ? "hover" : _$escape(undefined, true), false), _$escape(value()))
|
|
631
649
|
})];
|
|
632
650
|
const singleAction = () => {
|
|
633
651
|
const label = () => actionSlot()?.label ?? props.actionLabel ?? messages().rowAction;
|
|
@@ -641,7 +659,7 @@ function AppWorkspaceSidebarItem(props) {
|
|
|
641
659
|
actionSlot()?.onSelect?.(event);
|
|
642
660
|
props.onActionClick?.(event);
|
|
643
661
|
};
|
|
644
|
-
const content = () => actionSlot()?.children ?? _$ssr(_tmpl$
|
|
662
|
+
const content = () => actionSlot()?.children ?? _$ssr(_tmpl$19, _$ssrAttribute("class", _$escape(iconClass(actionSlot()?.icon ?? props.actionIcon, "ti-dots"), true), false));
|
|
645
663
|
return _$createComponent(Show, {
|
|
646
664
|
get when() {
|
|
647
665
|
return Boolean(actionSlot() || props.actionIcon);
|
|
@@ -652,10 +670,10 @@ function AppWorkspaceSidebarItem(props) {
|
|
|
652
670
|
return _$memo(() => !!actionSlot()?.href)() && !actionSlot()?.disabled;
|
|
653
671
|
},
|
|
654
672
|
get fallback() {
|
|
655
|
-
return _$ssr(_tmpl$
|
|
673
|
+
return _$ssr(_tmpl$22, _$ssrAttribute("disabled", actionSlot()?.disabled, true) + _$ssrAttribute("data-visibility", actionSlot()?.visibility === "hover" ? "hover" : _$escape(undefined, true), false) + _$ssrAttribute("aria-label", _$escape(label(), true), false), _$escape(content()));
|
|
656
674
|
},
|
|
657
675
|
get children() {
|
|
658
|
-
return _$ssr(_tmpl$
|
|
676
|
+
return _$ssr(_tmpl$21, _$ssrAttribute("href", _$escape(actionSlot()?.href, true), false), _$ssrAttribute("data-visibility", actionSlot()?.visibility === "hover" ? "hover" : _$escape(undefined, true), false) + _$ssrAttribute("aria-label", _$escape(label(), true), false), _$escape(content()));
|
|
659
677
|
}
|
|
660
678
|
});
|
|
661
679
|
}
|
|
@@ -891,21 +909,21 @@ const AppWorkspaceNavTree = props => {
|
|
|
891
909
|
return rowIcon();
|
|
892
910
|
},
|
|
893
911
|
get children() {
|
|
894
|
-
return _$ssr(_tmpl$
|
|
912
|
+
return _$ssr(_tmpl$23, _$ssrAttribute("data-k2b-nav-tree-toggle", usesIconDisclosure() ? "" : _$escape(undefined, true), false), _$ssrAttribute("class", _$escape(iconClass(rowIcon()), true), false));
|
|
895
913
|
}
|
|
896
|
-
}), _$ssr(_tmpl$
|
|
914
|
+
}), _$ssr(_tmpl$24, _$escape(item.label)), _$createComponent(Show, {
|
|
897
915
|
get when() {
|
|
898
916
|
return item.meta !== undefined;
|
|
899
917
|
},
|
|
900
918
|
get children() {
|
|
901
|
-
return _$ssr(_tmpl$
|
|
919
|
+
return _$ssr(_tmpl$25, `k2b-app-workspace__sidebar-item-meta ${hasChildren() ? "" : "k2b-app-workspace__nav-tree-leaf-meta"}`, _$ssrAttribute("data-visibility", item.metaVisibility === "hover" ? "hover" : _$escape(undefined, true), false), _$escape(item.meta));
|
|
902
920
|
}
|
|
903
921
|
}), _$createComponent(Show, {
|
|
904
922
|
get when() {
|
|
905
923
|
return _$memo(() => !!hasChildren())() && !usesIconDisclosure();
|
|
906
924
|
},
|
|
907
925
|
get children() {
|
|
908
|
-
return _$ssr(_tmpl$
|
|
926
|
+
return _$ssr(_tmpl$26, `ti ${isExpanded(item.id) ? "ti-chevron-down" : "ti-chevron-right"}`);
|
|
909
927
|
}
|
|
910
928
|
})];
|
|
911
929
|
const row = () => _$createComponent(AppWorkspaceSidebarRow, {
|
|
@@ -960,17 +978,17 @@ const AppWorkspaceNavTree = props => {
|
|
|
960
978
|
},
|
|
961
979
|
children: rowContent
|
|
962
980
|
});
|
|
963
|
-
return _$ssr(_tmpl$
|
|
981
|
+
return _$ssr(_tmpl$28, _$ssrAttribute("aria-level", _$escape(depth, true) + 1, false) + _$ssrAttribute("aria-selected", _$escape(selected(), true), false) + _$ssrAttribute("aria-expanded", hasChildren() ? _$escape(isExpanded(item.id), true) : _$escape(undefined, true), false) + _$ssrAttribute("aria-disabled", item.disabled ? "true" : _$escape(undefined, true), false) + _$ssrAttribute("tabindex", item.disabled ? -1 : tabStopId() === item.id ? 0 : -1, false) + _$ssrAttribute("data-k2b-nav-tree-id", _$escape(item.id, true), false) + _$ssrAttribute("data-k2b-nav-tree-parent-id", _$escape(parentId, true), false), _$escape(row()), _$escape(_$createComponent(Show, {
|
|
964
982
|
get when() {
|
|
965
983
|
return _$memo(() => !!hasChildren())() && isExpanded(item.id);
|
|
966
984
|
},
|
|
967
985
|
get children() {
|
|
968
|
-
return _$ssr(_tmpl$
|
|
986
|
+
return _$ssr(_tmpl$27, _$escape(renderItems(nested, depth + 1, item.id)));
|
|
969
987
|
}
|
|
970
988
|
})));
|
|
971
989
|
}
|
|
972
990
|
});
|
|
973
|
-
return _$ssr(_tmpl$
|
|
991
|
+
return _$ssr(_tmpl$29, `k2b-app-workspace__nav-tree ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("aria-label", _$escape(props.ariaLabel, true), false), _$escape(renderItems(roots, 0)));
|
|
974
992
|
};
|
|
975
993
|
AppWorkspaceNavTree.Item = AppWorkspaceNavTreeItem;
|
|
976
994
|
const AppWorkspaceSidebarIconGrid = props => _$ssrElement("section", _$mergeProps({
|
|
@@ -981,10 +999,10 @@ const AppWorkspaceSidebarIconGrid = props => _$ssrElement("section", _$mergeProp
|
|
|
981
999
|
get when() {
|
|
982
1000
|
return props.title;
|
|
983
1001
|
},
|
|
984
|
-
children: title => _$ssr(_tmpl$
|
|
985
|
-
})), _$ssr(_tmpl$
|
|
1002
|
+
children: title => _$ssr(_tmpl$12, _$escape(title()))
|
|
1003
|
+
})), _$ssr(_tmpl$30, _$ssrAttribute("data-columns", _$escape(props.columns ?? 2, true), false), _$escape(props.children))], false);
|
|
986
1004
|
const AppWorkspaceSidebarIconAction = props => {
|
|
987
|
-
const content = _$ssr(_tmpl$
|
|
1005
|
+
const content = _$ssr(_tmpl$31, _$ssrAttribute("class", _$escape(iconClass(props.icon), true), false));
|
|
988
1006
|
const attrs = () => ({
|
|
989
1007
|
class: `k2b-app-workspace__sidebar-icon-action ${props.active ? "is-active" : ""}`,
|
|
990
1008
|
title: props.label,
|
|
@@ -1050,7 +1068,7 @@ const AppWorkspace = props => {
|
|
|
1050
1068
|
return props.resizable !== false;
|
|
1051
1069
|
},
|
|
1052
1070
|
get children() {
|
|
1053
|
-
return _$ssr(_tmpl$
|
|
1071
|
+
return _$ssr(_tmpl$32, `k2b-app-workspace ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-mobile-surface", _$escape(props.mobileSurface, true), false) + _$ssrAttribute("data-sidebar-collapsed", initialLayoutState()?.sidebarCollapsed === undefined ? _$escape(undefined, true) : _$escape(String(initialLayoutState()?.sidebarCollapsed), true), false) + _$ssrAttribute("data-workspace-resizable", props.resizable === false ? "false" : "true", false), _$ssrStyle(appWorkspaceLayoutStyle(initialLayoutState())), _$escape(props.children));
|
|
1054
1072
|
}
|
|
1055
1073
|
});
|
|
1056
1074
|
};
|
|
@@ -1062,7 +1080,7 @@ AppWorkspace.LayoutStateProvider = props => _$createComponent(LayoutStateContext
|
|
|
1062
1080
|
return props.children;
|
|
1063
1081
|
}
|
|
1064
1082
|
});
|
|
1065
|
-
AppWorkspace.Content = props => _$ssr(_tmpl$
|
|
1083
|
+
AppWorkspace.Content = props => _$ssr(_tmpl$33, `k2b-app-workspace__content ${_$escape(props.class ?? "", true)}`, _$escape(props.children));
|
|
1066
1084
|
AppWorkspace.Main = AppWorkspaceMain;
|
|
1067
1085
|
AppWorkspace.MainPane = AppWorkspaceMainPane;
|
|
1068
1086
|
AppWorkspace.Detail = AppWorkspaceDetail;
|