@net-advantage/nabs-ui-shell 0.37.0 → 0.39.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/README.md CHANGED
@@ -22,6 +22,57 @@ export function Example() {
22
22
 
23
23
  The shell package re-exports all Nabs UI control modules so your project can use a single package dependency and import surface.
24
24
 
25
+ This includes path-aware `Navigation` behavior from `nabs-ui-navigation`:
26
+
27
+ - Use `path` on navigation items to update the browser URL without a full page reload.
28
+ - Navigation can auto-select active items by matching `window.location.pathname`.
29
+ - Set `syncActivePath={false}` to disable automatic active matching.
30
+
31
+ ## Branding
32
+
33
+ Use the `Branding` component to render a standard logo + title + byline lockup for shell headers.
34
+
35
+ ```tsx
36
+ import { Branding } from "@net-advantage/nabs-ui-shell";
37
+ import launchpadLogo from "./assets/net-advantage-logo-launch.svg";
38
+
39
+ export function HeaderBranding() {
40
+ return (
41
+ <Branding
42
+ logo={<img src={launchpadLogo} alt="" aria-hidden="true" />}
43
+ title="NABS UI Workbench"
44
+ byline="NABS Launchpad"
45
+ />
46
+ );
47
+ }
48
+ ```
49
+
50
+ ### Branding props
51
+
52
+ - `logo`: React node rendered on the left.
53
+ - `title`: React node rendered above the byline.
54
+ - `byline`: React node rendered below the title.
55
+ - `className` and other standard `div` attributes are also supported.
56
+
57
+ ## Navigation With Paths
58
+
59
+ ```tsx
60
+ import { Navigation } from "@net-advantage/nabs-ui-shell";
61
+
62
+ <Navigation
63
+ direction="vertical"
64
+ textAlignment="left"
65
+ items={[
66
+ { id: "home", label: "Home", path: "/home" },
67
+ { id: "components", label: "Components", path: "/components" },
68
+ { id: "settings", label: "Settings", path: "/settings" },
69
+ ]}
70
+ onItemSelect={(id) => console.log("selected", id)}
71
+ />
72
+ ```
73
+
74
+ If the current URL path already matches one of the configured `path` values, that item is selected automatically.
75
+
25
76
  ## Props
26
77
 
27
78
  - `header` renders the shell header area.
@@ -0,0 +1,3 @@
1
+ import { BrandingProps } from './Branding.types';
2
+ export declare const Branding: import('react').ForwardRefExoticComponent<BrandingProps & import('react').RefAttributes<HTMLDivElement>>;
3
+ export default Branding;
@@ -0,0 +1,6 @@
1
+ import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
+ export interface BrandingProps extends Omit<ComponentPropsWithoutRef<"div">, "title"> {
3
+ logo: ReactNode;
4
+ title: ReactNode;
5
+ byline: ReactNode;
6
+ }
package/dist/index.d.ts CHANGED
@@ -1,5 +1,7 @@
1
1
  export { Shell } from './Shell';
2
2
  export type { ShellProps } from './Shell.types';
3
+ export { Branding } from './Branding';
4
+ export type { BrandingProps } from './Branding.types';
3
5
  export * from '@net-advantage/nabs-ui-accordion';
4
6
  export * from '@net-advantage/nabs-ui-avatar';
5
7
  export * from '@net-advantage/nabs-ui-buttons';
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("@net-advantage/nabs-ui-layout"),n=require("react/jsx-runtime");var r=(0,e.forwardRef)(({header:e,navigation:r,footer:i,children:a,className:o=``,headerClassName:s=``,navigationClassName:c=``,contentClassName:l=``,footerClassName:u=``,...d},f)=>{let p=[`nabs-ui-shell`,o].filter(Boolean).join(` `),m=[`nabs-ui-shell__header`,s].filter(Boolean).join(` `),h=[`nabs-ui-shell__navigation`,c].filter(Boolean).join(` `),g=[`nabs-ui-shell__content`,l].filter(Boolean).join(` `),_=[`nabs-ui-shell__footer`,u].filter(Boolean).join(` `);return(0,n.jsx)(`div`,{ref:f,className:p,...d,children:(0,n.jsx)(t.Layout,{className:`nabs-ui-shell__layout`,header:e,footer:i,leftSidePanel:r,headerClassName:m,footerClassName:_,leftSidePanelClassName:h,contentClassName:g,children:a})})});r.displayName=`Shell`,exports.Shell=r;var i=require("@net-advantage/nabs-ui-accordion");Object.keys(i).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return i[e]}})});var a=require("@net-advantage/nabs-ui-avatar");Object.keys(a).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return a[e]}})});var o=require("@net-advantage/nabs-ui-buttons");Object.keys(o).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return o[e]}})});var s=require("@net-advantage/nabs-ui-cards");Object.keys(s).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return s[e]}})});var c=require("@net-advantage/nabs-ui-checkbox");Object.keys(c).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return c[e]}})});var l=require("@net-advantage/nabs-ui-code");Object.keys(l).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return l[e]}})});var u=require("@net-advantage/nabs-ui-combobox");Object.keys(u).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return u[e]}})});var d=require("@net-advantage/nabs-ui-datepicker");Object.keys(d).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return d[e]}})});var f=require("@net-advantage/nabs-ui-dialog");Object.keys(f).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return f[e]}})});var p=require("@net-advantage/nabs-ui-dropdownlist");Object.keys(p).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return p[e]}})});var m=require("@net-advantage/nabs-ui-dropdownmenu");Object.keys(m).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return m[e]}})});var h=require("@net-advantage/nabs-ui-dynamicform");Object.keys(h).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return h[e]}})});var g=require("@net-advantage/nabs-ui-fileupload");Object.keys(g).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return g[e]}})});var _=require("@net-advantage/nabs-ui-graph");Object.keys(_).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _[e]}})});var v=require("@net-advantage/nabs-ui-grid");Object.keys(v).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return v[e]}})}),Object.keys(t).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return t[e]}})});var y=require("@net-advantage/nabs-ui-markdown");Object.keys(y).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return y[e]}})});var b=require("@net-advantage/nabs-ui-navigation");Object.keys(b).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return b[e]}})});var x=require("@net-advantage/nabs-ui-panel");Object.keys(x).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return x[e]}})});var S=require("@net-advantage/nabs-ui-radiobutton");Object.keys(S).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return S[e]}})});var C=require("@net-advantage/nabs-ui-signature");Object.keys(C).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return C[e]}})});var w=require("@net-advantage/nabs-ui-slider");Object.keys(w).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return w[e]}})});var T=require("@net-advantage/nabs-ui-stepper");Object.keys(T).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return T[e]}})});var E=require("@net-advantage/nabs-ui-tab");Object.keys(E).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return E[e]}})});var D=require("@net-advantage/nabs-ui-textarea");Object.keys(D).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return D[e]}})});var O=require("@net-advantage/nabs-ui-textbox");Object.keys(O).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return O[e]}})});var k=require("@net-advantage/nabs-ui-toolbar");Object.keys(k).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return k[e]}})});
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("@net-advantage/nabs-ui-layout"),n=require("react/jsx-runtime");var r=(0,e.forwardRef)(({header:e,navigation:r,footer:i,children:a,className:o=``,headerClassName:s=``,navigationClassName:c=``,contentClassName:l=``,footerClassName:u=``,...d},f)=>{let p=[`nabs-ui-shell`,o].filter(Boolean).join(` `),m=[`nabs-ui-shell__header`,s].filter(Boolean).join(` `),h=[`nabs-ui-shell__navigation`,c].filter(Boolean).join(` `),g=[`nabs-ui-shell__content`,l].filter(Boolean).join(` `),_=[`nabs-ui-shell__footer`,u].filter(Boolean).join(` `);return(0,n.jsx)(`div`,{ref:f,className:p,...d,children:(0,n.jsx)(t.Layout,{className:`nabs-ui-shell__layout`,header:e,footer:i,leftSidePanel:r,headerClassName:m,footerClassName:_,leftSidePanelClassName:h,contentClassName:g,children:a})})});r.displayName=`Shell`;var i=(0,e.forwardRef)(function({logo:e,title:t,byline:r,className:i=``,...a},o){return(0,n.jsxs)(`div`,{ref:o,className:[`nabs-ui-branding`,i].filter(Boolean).join(` `),...a,children:[(0,n.jsx)(`div`,{className:`nabs-ui-branding__logo`,"aria-hidden":`true`,children:e}),(0,n.jsxs)(`div`,{className:`nabs-ui-branding__text`,children:[(0,n.jsx)(`strong`,{className:`nabs-ui-branding__title`,children:t}),(0,n.jsx)(`span`,{className:`nabs-ui-branding__byline`,children:r})]})]})});i.displayName=`Branding`,exports.Branding=i,exports.Shell=r;var a=require("@net-advantage/nabs-ui-accordion");Object.keys(a).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return a[e]}})});var o=require("@net-advantage/nabs-ui-avatar");Object.keys(o).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return o[e]}})});var s=require("@net-advantage/nabs-ui-buttons");Object.keys(s).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return s[e]}})});var c=require("@net-advantage/nabs-ui-cards");Object.keys(c).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return c[e]}})});var l=require("@net-advantage/nabs-ui-checkbox");Object.keys(l).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return l[e]}})});var u=require("@net-advantage/nabs-ui-code");Object.keys(u).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return u[e]}})});var d=require("@net-advantage/nabs-ui-combobox");Object.keys(d).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return d[e]}})});var f=require("@net-advantage/nabs-ui-datepicker");Object.keys(f).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return f[e]}})});var p=require("@net-advantage/nabs-ui-dialog");Object.keys(p).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return p[e]}})});var m=require("@net-advantage/nabs-ui-dropdownlist");Object.keys(m).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return m[e]}})});var h=require("@net-advantage/nabs-ui-dropdownmenu");Object.keys(h).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return h[e]}})});var g=require("@net-advantage/nabs-ui-dynamicform");Object.keys(g).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return g[e]}})});var _=require("@net-advantage/nabs-ui-fileupload");Object.keys(_).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return _[e]}})});var v=require("@net-advantage/nabs-ui-graph");Object.keys(v).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return v[e]}})});var y=require("@net-advantage/nabs-ui-grid");Object.keys(y).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return y[e]}})}),Object.keys(t).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return t[e]}})});var b=require("@net-advantage/nabs-ui-markdown");Object.keys(b).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return b[e]}})});var x=require("@net-advantage/nabs-ui-navigation");Object.keys(x).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return x[e]}})});var S=require("@net-advantage/nabs-ui-panel");Object.keys(S).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return S[e]}})});var C=require("@net-advantage/nabs-ui-radiobutton");Object.keys(C).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return C[e]}})});var w=require("@net-advantage/nabs-ui-signature");Object.keys(w).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return w[e]}})});var T=require("@net-advantage/nabs-ui-slider");Object.keys(T).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return T[e]}})});var E=require("@net-advantage/nabs-ui-stepper");Object.keys(E).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return E[e]}})});var D=require("@net-advantage/nabs-ui-tab");Object.keys(D).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return D[e]}})});var O=require("@net-advantage/nabs-ui-textarea");Object.keys(O).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return O[e]}})});var k=require("@net-advantage/nabs-ui-textbox");Object.keys(k).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return k[e]}})});var A=require("@net-advantage/nabs-ui-toolbar");Object.keys(A).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return A[e]}})});
@@ -136,4 +136,42 @@
136
136
  /*$vite$:1*/.nabs-ui-textarea{gap:var(--nabs-ui-density-gap-field,.5rem);min-width:0;display:grid}.nabs-ui-textarea__label{font-size:var(--nabs-ui-density-font-size-control,.95rem);font-weight:600;line-height:var(--nabs-ui-density-line-height-control,1.2)}.nabs-ui-textarea__input{box-sizing:border-box;font:inherit;min-height:var(--nabs-ui-density-textarea-min-height,8rem);min-width:0;padding:var(--nabs-ui-density-textarea-padding-y,.85rem) var(--nabs-ui-density-textarea-padding-x,1rem);resize:vertical;width:100%;transition:border-color .12s,box-shadow .12s,background-color .12s}.nabs-ui-textarea__input[data-resize=none]{resize:none}.nabs-ui-textarea__input[data-resize=both]{resize:both}.nabs-ui-textarea__input[data-resize=horizontal]{resize:horizontal}.nabs-ui-textarea__input:disabled{cursor:not-allowed}
137
137
  /*$vite$:1*/.nabs-ui-textbox{gap:var(--nabs-ui-density-gap-field,.7rem);display:grid}.nabs-ui-textbox__label{font-size:var(--nabs-ui-density-font-size-control,.95rem);font-weight:600}.nabs-ui-textbox__input{appearance:none;box-sizing:border-box;font:inherit;line-height:var(--nabs-ui-density-line-height-control,1.4);min-height:var(--nabs-ui-density-input-min-height,3rem);padding:var(--nabs-ui-density-input-padding-y,.8rem) var(--nabs-ui-density-input-padding-x,1rem);width:100%;transition:border-color .12s,box-shadow .12s,background-color .12s}.nabs-ui-textbox__input:disabled{cursor:not-allowed}.nabs-ui-textbox--label-left{align-items:center;gap:var(--nabs-ui-density-gap-label-left,1rem);display:flex}.nabs-ui-textbox--label-left .nabs-ui-textbox__label{flex:0 0 var(--nabs-ui-density-label-width,9rem)}.nabs-ui-textbox--label-left .nabs-ui-textbox__input{flex:auto}@media (width<=640px){.nabs-ui-textbox--label-left{align-items:stretch;gap:var(--nabs-ui-density-gap-field,.7rem);flex-direction:column}.nabs-ui-textbox--label-left .nabs-ui-textbox__label{flex-basis:auto}}
138
138
  /*$vite$:1*/.nabs-ui-toolbar{align-items:center;gap:var(--nabs-ui-density-toolbar-gap,.1rem);min-height:var(--nabs-ui-density-toolbar-min-height,3.65rem);padding:var(--nabs-ui-density-toolbar-padding-y,.4rem) var(--nabs-ui-density-toolbar-padding-x,.45rem);flex-wrap:wrap;display:inline-flex}.nabs-ui-toolbar__button{cursor:pointer;font:inherit;align-items:center;gap:var(--nabs-ui-density-toolbar-button-gap,.25rem);min-height:var(--nabs-ui-density-toolbar-button-min-size,2.75rem);min-width:var(--nabs-ui-density-toolbar-button-min-size,2.75rem);padding:var(--nabs-ui-density-toolbar-button-padding-y,.35rem) var(--nabs-ui-density-toolbar-button-padding-x,.8rem);justify-content:center;transition:transform .12s,box-shadow .12s,border-color .12s,background-color .12s,color .12s;display:inline-flex}.nabs-ui-toolbar__button:hover:not(:disabled){transform:translateY(var(--nabs-ui-density-control-hover-translate-y,-1px))}.nabs-ui-toolbar__button:disabled{cursor:not-allowed}.nabs-ui-toolbar__button--icon-only{padding-inline:var(--nabs-ui-density-toolbar-icon-only-padding-inline,.55rem)}.nabs-ui-toolbar__content{align-items:center;gap:var(--nabs-ui-density-toolbar-content-gap,.42rem);display:inline-flex}.nabs-ui-toolbar__content--label-left{flex-direction:row-reverse}.nabs-ui-toolbar__content--label-right{flex-direction:row}.nabs-ui-toolbar__content--label-top{flex-direction:column-reverse}.nabs-ui-toolbar__content--label-bottom{flex-direction:column}.nabs-ui-toolbar__icon{height:var(--nabs-ui-density-toolbar-icon-size,1.08rem);stroke-width:1.75px;width:var(--nabs-ui-density-toolbar-icon-size,1.08rem);flex:none;display:block}.nabs-ui-toolbar__label{font-size:var(--nabs-ui-density-toolbar-label-font-size,.95rem);white-space:nowrap;font-weight:500;line-height:1}
139
- /*$vite$:1*//*$vite$:1*/
139
+ /*$vite$:1*/.nabs-ui-branding {
140
+ display: inline-flex;
141
+ align-items: center;
142
+ gap: var(--nabs-ui-branding-gap, 0.75rem);
143
+ min-width: 0;
144
+ }
145
+
146
+ .nabs-ui-branding__logo {
147
+ display: inline-flex;
148
+ align-items: center;
149
+ justify-content: center;
150
+ flex: 0 0 auto;
151
+ }
152
+
153
+ .nabs-ui-branding__logo :where(img, svg) {
154
+ display: block;
155
+ inline-size: var(--nabs-ui-branding-logo-size, 2rem);
156
+ block-size: var(--nabs-ui-branding-logo-size, 2rem);
157
+ }
158
+
159
+ .nabs-ui-branding__text {
160
+ display: grid;
161
+ gap: var(--nabs-ui-branding-text-gap, 0.125rem);
162
+ min-width: 0;
163
+ }
164
+
165
+ .nabs-ui-branding__title {
166
+ margin: 0;
167
+ font-size: var(--nabs-ui-branding-title-size, 1.125rem);
168
+ font-weight: var(--nabs-ui-branding-title-weight, 700);
169
+ line-height: var(--nabs-ui-branding-title-line-height, 1.2);
170
+ }
171
+
172
+ .nabs-ui-branding__byline {
173
+ margin: 0;
174
+ font-size: var(--nabs-ui-branding-byline-size, 0.75rem);
175
+ font-weight: var(--nabs-ui-branding-byline-weight, 400);
176
+ line-height: var(--nabs-ui-branding-byline-line-height, 1.25);
177
+ }/*$vite$:1*/
@@ -1,6 +1,6 @@
1
1
  import { forwardRef as e } from "react";
2
2
  import { Layout as t } from "@net-advantage/nabs-ui-layout";
3
- import { jsx as n } from "react/jsx-runtime";
3
+ import { jsx as n, jsxs as r } from "react/jsx-runtime";
4
4
  export * from "@net-advantage/nabs-ui-layout";
5
5
  export * from "@net-advantage/nabs-ui-accordion";
6
6
  export * from "@net-advantage/nabs-ui-avatar";
@@ -29,7 +29,7 @@ export * from "@net-advantage/nabs-ui-textarea";
29
29
  export * from "@net-advantage/nabs-ui-textbox";
30
30
  export * from "@net-advantage/nabs-ui-toolbar";
31
31
  //#region src/Shell.tsx
32
- var r = e(({ header: e, navigation: r, footer: i, children: a, className: o = "", headerClassName: s = "", navigationClassName: c = "", contentClassName: l = "", footerClassName: u = "", ...d }, f) => {
32
+ var i = e(({ header: e, navigation: r, footer: i, children: a, className: o = "", headerClassName: s = "", navigationClassName: c = "", contentClassName: l = "", footerClassName: u = "", ...d }, f) => {
33
33
  let p = ["nabs-ui-shell", o].filter(Boolean).join(" "), m = ["nabs-ui-shell__header", s].filter(Boolean).join(" "), h = ["nabs-ui-shell__navigation", c].filter(Boolean).join(" "), g = ["nabs-ui-shell__content", l].filter(Boolean).join(" "), _ = ["nabs-ui-shell__footer", u].filter(Boolean).join(" ");
34
34
  return /* @__PURE__ */ n("div", {
35
35
  ref: f,
@@ -48,6 +48,30 @@ var r = e(({ header: e, navigation: r, footer: i, children: a, className: o = ""
48
48
  })
49
49
  });
50
50
  });
51
- r.displayName = "Shell";
51
+ i.displayName = "Shell";
52
52
  //#endregion
53
- export { r as Shell };
53
+ //#region src/Branding.tsx
54
+ var a = e(function({ logo: e, title: t, byline: i, className: a = "", ...o }, s) {
55
+ return /* @__PURE__ */ r("div", {
56
+ ref: s,
57
+ className: ["nabs-ui-branding", a].filter(Boolean).join(" "),
58
+ ...o,
59
+ children: [/* @__PURE__ */ n("div", {
60
+ className: "nabs-ui-branding__logo",
61
+ "aria-hidden": "true",
62
+ children: e
63
+ }), /* @__PURE__ */ r("div", {
64
+ className: "nabs-ui-branding__text",
65
+ children: [/* @__PURE__ */ n("strong", {
66
+ className: "nabs-ui-branding__title",
67
+ children: t
68
+ }), /* @__PURE__ */ n("span", {
69
+ className: "nabs-ui-branding__byline",
70
+ children: i
71
+ })]
72
+ })]
73
+ });
74
+ });
75
+ a.displayName = "Branding";
76
+ //#endregion
77
+ export { a as Branding, i as Shell };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@net-advantage/nabs-ui-shell",
3
- "version": "0.37.0",
3
+ "version": "0.39.0",
4
4
  "description": "Reusable React app shell for the Nabs UI library.",
5
5
  "type": "module",
6
6
  "main": "./dist/nabs-ui-shell.cjs",
@@ -8,10 +8,18 @@
8
8
  "types": "./dist/index.d.ts",
9
9
  "exports": {
10
10
  ".": {
11
+ "types": "./dist/index.d.ts",
11
12
  "import": "./dist/nabs-ui-shell.js",
12
13
  "require": "./dist/nabs-ui-shell.cjs"
13
14
  },
14
- "./Shell": "./src/Shell.tsx",
15
+ "./Branding": {
16
+ "types": "./dist/Branding.d.ts",
17
+ "default": "./src/Branding.tsx"
18
+ },
19
+ "./Shell": {
20
+ "types": "./dist/Shell.d.ts",
21
+ "default": "./src/Shell.tsx"
22
+ },
15
23
  "./style.css": "./dist/nabs-ui-shell.css"
16
24
  },
17
25
  "files": [
@@ -19,36 +27,36 @@
19
27
  ],
20
28
  "dependencies": {
21
29
  "react": "^19.0.0",
22
- "@net-advantage/nabs-ui-accordion": "0.37.0",
23
- "@net-advantage/nabs-ui-avatar": "0.37.0",
24
- "@net-advantage/nabs-ui-buttons": "0.37.0",
25
- "@net-advantage/nabs-ui-checkbox": "0.37.0",
26
- "@net-advantage/nabs-ui-code": "0.37.0",
27
- "@net-advantage/nabs-ui-cards": "0.37.0",
28
- "@net-advantage/nabs-ui-combobox": "0.37.0",
29
- "@net-advantage/nabs-ui-datepicker": "0.37.0",
30
- "@net-advantage/nabs-ui-dialog": "0.37.0",
31
- "@net-advantage/nabs-ui-dropdownlist": "0.37.0",
32
- "@net-advantage/nabs-ui-dropdownmenu": "0.37.0",
33
- "@net-advantage/nabs-ui-dynamicform": "0.37.0",
34
- "@net-advantage/nabs-ui-fileupload": "0.37.0",
35
- "@net-advantage/nabs-ui-graph": "0.37.0",
36
- "@net-advantage/nabs-ui-grid": "0.37.0",
37
- "@net-advantage/nabs-ui-layout": "0.37.0",
38
- "@net-advantage/nabs-ui-markdown": "0.37.0",
39
- "@net-advantage/nabs-ui-navigation": "0.37.0",
40
- "@net-advantage/nabs-ui-panel": "0.37.0",
41
- "@net-advantage/nabs-ui-radiobutton": "0.37.0",
42
- "@net-advantage/nabs-ui-signature": "0.37.0",
43
- "@net-advantage/nabs-ui-slider": "0.37.0",
44
- "@net-advantage/nabs-ui-stepper": "0.37.0",
45
- "@net-advantage/nabs-ui-tab": "0.37.0",
46
- "@net-advantage/nabs-ui-textarea": "0.37.0",
47
- "@net-advantage/nabs-ui-textbox": "0.37.0",
48
- "@net-advantage/nabs-ui-themes": "0.37.0",
49
- "@net-advantage/nabs-ui-themes-dark": "0.37.0",
50
- "@net-advantage/nabs-ui-toolbar": "0.37.0",
51
- "@net-advantage/nabs-ui-themes-light": "0.37.0"
30
+ "@net-advantage/nabs-ui-accordion": "0.39.0",
31
+ "@net-advantage/nabs-ui-avatar": "0.39.0",
32
+ "@net-advantage/nabs-ui-buttons": "0.39.0",
33
+ "@net-advantage/nabs-ui-cards": "0.39.0",
34
+ "@net-advantage/nabs-ui-checkbox": "0.39.0",
35
+ "@net-advantage/nabs-ui-code": "0.39.0",
36
+ "@net-advantage/nabs-ui-combobox": "0.39.0",
37
+ "@net-advantage/nabs-ui-datepicker": "0.39.0",
38
+ "@net-advantage/nabs-ui-dialog": "0.39.0",
39
+ "@net-advantage/nabs-ui-dropdownlist": "0.39.0",
40
+ "@net-advantage/nabs-ui-dropdownmenu": "0.39.0",
41
+ "@net-advantage/nabs-ui-dynamicform": "0.39.0",
42
+ "@net-advantage/nabs-ui-fileupload": "0.39.0",
43
+ "@net-advantage/nabs-ui-graph": "0.39.0",
44
+ "@net-advantage/nabs-ui-grid": "0.39.0",
45
+ "@net-advantage/nabs-ui-layout": "0.39.0",
46
+ "@net-advantage/nabs-ui-markdown": "0.39.0",
47
+ "@net-advantage/nabs-ui-navigation": "0.39.0",
48
+ "@net-advantage/nabs-ui-panel": "0.39.0",
49
+ "@net-advantage/nabs-ui-radiobutton": "0.39.0",
50
+ "@net-advantage/nabs-ui-signature": "0.39.0",
51
+ "@net-advantage/nabs-ui-slider": "0.39.0",
52
+ "@net-advantage/nabs-ui-stepper": "0.39.0",
53
+ "@net-advantage/nabs-ui-tab": "0.39.0",
54
+ "@net-advantage/nabs-ui-textarea": "0.39.0",
55
+ "@net-advantage/nabs-ui-textbox": "0.39.0",
56
+ "@net-advantage/nabs-ui-themes": "0.39.0",
57
+ "@net-advantage/nabs-ui-themes-dark": "0.39.0",
58
+ "@net-advantage/nabs-ui-themes-light": "0.39.0",
59
+ "@net-advantage/nabs-ui-toolbar": "0.39.0"
52
60
  },
53
61
  "devDependencies": {
54
62
  "@types/react": "^19.0.0",