@burdenoff/fe-libs 2026.1027.3 → 2026.1027.4

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.
Files changed (3) hide show
  1. package/dist/chrome/MobileTabBar.d.ts +9 -2
  2. package/dist/chrome/MobileTabBar.js +51 -42
  3. package/package.json +1 -1
package/dist/chrome/MobileTabBar.d.ts CHANGED
@@ -1,7 +1,14 @@
1
+ import { ReactNode } from 'react';
1
2
  import { MobileActionItem } from './HeaderBar';
2
3
  export interface MobileTabBarProps {
3
- /** Product name — used for the tab bar's accessible label. */
4
+ /** Product name — used for the tab bar's accessible label and, with `logo`, the More sheet's brand header. */
4
5
  appName: string;
6
+ /**
7
+ * Brand mark shown with `appName` at the top of the More sheet (same
8
+ * `logo` prop shape as `ProductSideNav`: a short string or an SVG/img
9
+ * node). Omit to keep the sheet's plain "More" title.
10
+ */
11
+ logo?: ReactNode;
5
12
  /** Nav group ordering for the More sheet (same as ProductSideNav). */
6
13
  groupOrder?: string[];
7
14
  /** Nav group display labels for the More sheet (same as ProductSideNav). */
@@ -20,6 +27,6 @@ export interface MobileTabBarProps {
20
27
  hideWhenKeyboardOpen?: boolean;
21
28
  className?: string;
22
29
  }
23
- export declare function MobileTabBar({ appName, groupOrder, groupLabels, maxTabs, moreLabel, mobileActions, hideWhenKeyboardOpen, className, }: MobileTabBarProps): import('react/jsx-runtime').JSX.Element;
30
+ export declare function MobileTabBar({ appName, logo, groupOrder, groupLabels, maxTabs, moreLabel, mobileActions, hideWhenKeyboardOpen, className, }: MobileTabBarProps): import('react/jsx-runtime').JSX.Element;
24
31
  export { useMobileTabBarVisible } from './mobileTabBar/useMobileTabBarVisible';
25
32
  export { selectMobileTabs } from './mobileTabBar/selectTabs';
package/dist/chrome/MobileTabBar.js CHANGED
@@ -39,14 +39,14 @@ function D(e, t, n) {
39
39
  items: r.get(e) ?? []
40
40
  }));
41
41
  }
42
- function O({ appName: a, groupOrder: O = [], groupLabels: A = {}, maxTabs: j = 4, moreLabel: M, mobileActions: N, hideWhenKeyboardOpen: P = !0, className: F }) {
43
- let I = o(), L = M ?? I("nav.more", "More"), R = w(), z = C(), B = c(), { items: V } = l(), [H, U] = v(!1), W = _(null), { tabs: G, more: K, hasMore: q } = g(() => f(V, j), [V, j]), J = g(() => D(K, O, A), [
44
- K,
45
- O,
46
- A
47
- ]), Y = !!N && N.length > 0, X = q || Y;
42
+ function O({ appName: a, logo: O, groupOrder: A = [], groupLabels: j = {}, maxTabs: M = 4, moreLabel: N, mobileActions: P, hideWhenKeyboardOpen: F = !0, className: I }) {
43
+ let L = o(), R = N ?? L("nav.more", "More"), z = w(), B = C(), V = c(), { items: H } = l(), [U, W] = v(!1), G = _(null), { tabs: K, more: q, hasMore: J } = g(() => f(H, M), [H, M]), Y = g(() => D(q, A, j), [
44
+ q,
45
+ A,
46
+ j
47
+ ]), X = !!P && P.length > 0, Z = J || X;
48
48
  h(() => {
49
- let e = W.current;
49
+ let e = G.current;
50
50
  if (!e || typeof window > "u") return;
51
51
  let t = document.documentElement, n = () => t.style.setProperty(T, `${e.offsetHeight}px`);
52
52
  n();
@@ -55,25 +55,25 @@ function O({ appName: a, groupOrder: O = [], groupLabels: A = {}, maxTabs: j = 4
55
55
  r?.disconnect(), t.style.removeProperty(T);
56
56
  };
57
57
  }, []), m(() => {
58
- U(!1);
59
- }, [z.pathname]);
60
- let Z = p((e) => {
61
- E(), R(s(e, B));
62
- }, [R, B]), Q = g(() => !!q && K.some((e) => u(e, z.pathname)), [
58
+ W(!1);
59
+ }, [B.pathname]);
60
+ let Q = p((e) => {
61
+ E(), z(s(e, V));
62
+ }, [z, V]), $ = g(() => !!J && q.some((e) => u(e, B.pathname)), [
63
+ J,
63
64
  q,
64
- K,
65
- z.pathname
65
+ B.pathname
66
66
  ]);
67
67
  return /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ S("nav", {
68
- ref: W,
68
+ ref: G,
69
69
  role: "tablist",
70
- "aria-label": I("nav.primaryNavigation", `${a} navigation`),
70
+ "aria-label": L("nav.primaryNavigation", `${a} navigation`),
71
71
  "data-mobile-tabbar": "",
72
72
  "data-shell-chrome": "",
73
- "data-keyboard-keep": P ? void 0 : "",
74
- className: e("fixed inset-x-0 bottom-0 z-[60] flex items-stretch", "bg-bg-surface text-text-primary", F),
75
- children: [G.map((t) => {
76
- let n = u(t, z.pathname);
73
+ "data-keyboard-keep": F ? void 0 : "",
74
+ className: e("fixed inset-x-0 bottom-0 z-[60] flex items-stretch", "bg-bg-surface text-text-primary", I),
75
+ children: [K.map((t) => {
76
+ let n = u(t, B.pathname);
77
77
  return /* @__PURE__ */ S("button", {
78
78
  type: "button",
79
79
  role: "tab",
@@ -83,7 +83,7 @@ function O({ appName: a, groupOrder: O = [], groupLabels: A = {}, maxTabs: j = 4
83
83
  "data-mobile-tab": t.id,
84
84
  className: e("mobile-tab relative flex min-w-0 flex-1 flex-col items-center justify-center gap-0.5", "text-text-muted transition-colors duration-150", n && "text-text-link"),
85
85
  onClick: () => {
86
- n && !t.children?.length || Z(d(t));
86
+ n && !t.children?.length || Q(d(t));
87
87
  },
88
88
  children: [/* @__PURE__ */ S("span", {
89
89
  className: "mobile-tab__icon relative inline-flex items-center justify-center",
@@ -97,18 +97,18 @@ function O({ appName: a, groupOrder: O = [], groupLabels: A = {}, maxTabs: j = 4
97
97
  children: t.label
98
98
  })]
99
99
  }, t.id);
100
- }), X ? /* @__PURE__ */ S("button", {
100
+ }), Z ? /* @__PURE__ */ S("button", {
101
101
  type: "button",
102
102
  role: "tab",
103
- "aria-selected": Q,
103
+ "aria-selected": $,
104
104
  "aria-haspopup": "dialog",
105
- "aria-expanded": H,
106
- "aria-label": L,
107
- "data-active": Q ? "" : void 0,
105
+ "aria-expanded": U,
106
+ "aria-label": R,
107
+ "data-active": $ ? "" : void 0,
108
108
  "data-mobile-tab": "__more",
109
- className: e("mobile-tab relative flex min-w-0 flex-1 flex-col items-center justify-center gap-0.5", "text-text-muted transition-colors duration-150", Q && "text-text-link"),
109
+ className: e("mobile-tab relative flex min-w-0 flex-1 flex-col items-center justify-center gap-0.5", "text-text-muted transition-colors duration-150", $ && "text-text-link"),
110
110
  onClick: () => {
111
- E(), U(!0);
111
+ E(), W(!0);
112
112
  },
113
113
  children: [/* @__PURE__ */ x("span", {
114
114
  className: "mobile-tab__icon inline-flex items-center justify-center",
@@ -116,19 +116,28 @@ function O({ appName: a, groupOrder: O = [], groupLabels: A = {}, maxTabs: j = 4
116
116
  children: /* @__PURE__ */ x(y, {})
117
117
  }), /* @__PURE__ */ x("span", {
118
118
  className: "mobile-tab__label max-w-full truncate",
119
- children: L
119
+ children: R
120
120
  })]
121
121
  }) : null]
122
- }), X ? /* @__PURE__ */ x(t, {
123
- open: H,
124
- onOpenChange: U,
122
+ }), Z ? /* @__PURE__ */ x(t, {
123
+ open: U,
124
+ onOpenChange: W,
125
125
  children: /* @__PURE__ */ S(n, {
126
- "aria-label": L,
126
+ "aria-label": R,
127
127
  "data-swipe-ignore": "",
128
- children: [/* @__PURE__ */ x(r, { children: /* @__PURE__ */ x(i, { children: L }) }), /* @__PURE__ */ S("div", {
128
+ children: [/* @__PURE__ */ S(r, { children: [O ? /* @__PURE__ */ S("div", {
129
+ className: "mb-1 flex items-center gap-2",
130
+ children: [/* @__PURE__ */ x("div", {
131
+ className: "flex size-8 flex-shrink-0 items-center justify-center",
132
+ children: O
133
+ }), /* @__PURE__ */ x("span", {
134
+ className: "text-heading-h4 font-semibold text-text-primary",
135
+ children: a
136
+ })]
137
+ }) : null, /* @__PURE__ */ x(i, { children: R })] }), /* @__PURE__ */ S("div", {
129
138
  className: "flex flex-col gap-4 pb-2",
130
139
  "data-mobile-tabbar-more": "",
131
- children: [J.map((e) => /* @__PURE__ */ S("section", {
140
+ children: [Y.map((e) => /* @__PURE__ */ S("section", {
132
141
  "aria-label": e.label ?? void 0,
133
142
  children: [e.label ? /* @__PURE__ */ x("p", {
134
143
  className: "mb-1 px-1 text-[11px] font-medium uppercase tracking-wider text-text-muted",
@@ -136,29 +145,29 @@ function O({ appName: a, groupOrder: O = [], groupLabels: A = {}, maxTabs: j = 4
136
145
  }) : null, /* @__PURE__ */ x("ul", {
137
146
  className: "flex flex-col",
138
147
  children: e.items.map((e) => {
139
- let t = u(e, z.pathname);
148
+ let t = u(e, B.pathname);
140
149
  return /* @__PURE__ */ x("li", { children: /* @__PURE__ */ x(k, {
141
150
  icon: e.icon,
142
151
  label: e.label,
143
152
  badge: e.badge,
144
153
  active: t,
145
- onSelect: () => Z(d(e))
154
+ onSelect: () => Q(d(e))
146
155
  }) }, e.id);
147
156
  })
148
157
  })]
149
- }, e.key || "__ungrouped")), Y ? /* @__PURE__ */ S("section", {
150
- "aria-label": I("appShell.quickActions", "Quick Actions"),
158
+ }, e.key || "__ungrouped")), X ? /* @__PURE__ */ S("section", {
159
+ "aria-label": L("appShell.quickActions", "Quick Actions"),
151
160
  children: [/* @__PURE__ */ x("p", {
152
161
  className: "mb-1 px-1 text-[11px] font-medium uppercase tracking-wider text-text-muted",
153
- children: I("appShell.quickActions", "Quick Actions")
162
+ children: L("appShell.quickActions", "Quick Actions")
154
163
  }), /* @__PURE__ */ x("ul", {
155
164
  className: "flex flex-col",
156
- children: N?.map((e) => /* @__PURE__ */ x("li", { children: /* @__PURE__ */ x(k, {
165
+ children: P?.map((e) => /* @__PURE__ */ x("li", { children: /* @__PURE__ */ x(k, {
157
166
  icon: e.icon,
158
167
  label: e.label,
159
168
  active: !!e.isToggle && !!e.isActive,
160
169
  onSelect: () => {
161
- E(), e.onClick(), U(!1);
170
+ E(), e.onClick(), W(!1);
162
171
  }
163
172
  }) }, e.id))
164
173
  })]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@burdenoff/fe-libs",
3
- "version": "2026.1027.3",
3
+ "version": "2026.1027.4",
4
4
  "description": "Burdenoff frontend primitives and domain libraries",
5
5
  "type": "module",
6
6
  "bin": {