@net-advantage/nabs-ui-shell 0.1.0 → 0.19.0

package/dist/nabs-ui-shell.cjs

@@ -1,6 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t),e=null),t.exports);let t=require("react");var n=e((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.fragment`);function r(e,n,r){var i=null;if(r!==void 0&&(i=``+r),n.key!==void 0&&(i=``+n.key),`key`in n)for(var a in r={},n)a!==`key`&&(r[a]=n[a]);else r=n;return n=r.ref,{$$typeof:t,type:e,key:i,ref:n===void 0?null:n,props:r}}e.Fragment=n,e.jsx=r,e.jsxs=r})),r=e((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e){if(e==null)return null;if(typeof e==`function`)return e.$$typeof===O?null:e.displayName||e.name||null;if(typeof e==`string`)return e;switch(e){case _:return`Fragment`;case y:return`Profiler`;case v:return`StrictMode`;case C:return`Suspense`;case w:return`SuspenseList`;case D:return`Activity`}if(typeof e==`object`)switch(typeof e.tag==`number`&&console.error(`Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue.`),e.$$typeof){case g:return`Portal`;case x:return e.displayName||`Context`;case b:return(e._context.displayName||`Context`)+`.Consumer`;case S:var n=e.render;return e=e.displayName,e||=(e=n.displayName||n.name||``,e===``?`ForwardRef`:`ForwardRef(`+e+`)`),e;case T:return n=e.displayName||null,n===null?t(e.type)||`Memo`:n;case E:n=e._payload,e=e._init;try{return t(e(n))}catch{}}return null}function n(e){return``+e}function r(e){try{n(e);var t=!1}catch{t=!0}if(t){t=console;var r=t.error,i=typeof Symbol==`function`&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||`Object`;return r.call(t,`The provided key is an unsupported type %s. This value must be coerced to a string before using it here.`,i),n(e)}}function i(e){if(e===_)return`<>`;if(typeof e==`object`&&e&&e.$$typeof===E)return`<...>`;try{var n=t(e);return n?`<`+n+`>`:`<...>`}catch{return`<...>`}}function a(){var e=k.A;return e===null?null:e.getOwner()}function o(){return Error(`react-stack-top-frame`)}function s(e){if(A.call(e,`key`)){var t=Object.getOwnPropertyDescriptor(e,`key`).get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function c(e,t){function n(){N||(N=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",t))}n.isReactWarning=!0,Object.defineProperty(e,"key",{get:n,configurable:!0})}function l(){var e=t(this.type);return P[e]||(P[e]=!0,console.error(`Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.`)),e=this.props.ref,e===void 0?null:e}function u(e,t,n,r,i,a){var o=n.ref;return e={$$typeof:h,type:e,key:t,props:n,_owner:r},(o===void 0?null:o)===null?Object.defineProperty(e,"ref",{enumerable:!1,value:null}):Object.defineProperty(e,"ref",{enumerable:!1,get:l}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:i}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:a}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function d(e,n,i,o,l,d){var p=n.children;if(p!==void 0)if(o)if(j(p)){for(o=0;o<p.length;o++)f(p[o]);Object.freeze&&Object.freeze(p)}else console.error(`React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.`);else f(p);if(A.call(n,`key`)){p=t(e);var m=Object.keys(n).filter(function(e){return e!==`key`});o=0<m.length?`{key: someKey, `+m.join(`: ..., `)+`: ...}`:`{key: someKey}`,L[p+o]||(m=0<m.length?`{`+m.join(`: ..., `)+`: ...}`:`{}`,console.error(`A props object containing a "key" prop is being spread into JSX:
-  let props = %s;
-  <%s {...props} />
-React keys must be passed directly to JSX without using spread:
-  let props = %s;
-  <%s key={someKey} {...props} />`,o,p,m,p),L[p+o]=!0)}if(p=null,i!==void 0&&(r(i),p=``+i),s(n)&&(r(n.key),p=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return p&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,p,i,a(),l,d)}function f(e){p(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===E&&(e._payload.status===`fulfilled`?p(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function p(e){return typeof e==`object`&&!!e&&e.$$typeof===h}var m=require("react"),h=Symbol.for(`react.transitional.element`),g=Symbol.for(`react.portal`),_=Symbol.for(`react.fragment`),v=Symbol.for(`react.strict_mode`),y=Symbol.for(`react.profiler`),b=Symbol.for(`react.consumer`),x=Symbol.for(`react.context`),S=Symbol.for(`react.forward_ref`),C=Symbol.for(`react.suspense`),w=Symbol.for(`react.suspense_list`),T=Symbol.for(`react.memo`),E=Symbol.for(`react.lazy`),D=Symbol.for(`react.activity`),O=Symbol.for(`react.client.reference`),k=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,A=Object.prototype.hasOwnProperty,j=Array.isArray,M=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var N,P={},F=m.react_stack_bottom_frame.bind(m,o)(),I=M(i(o)),L={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!1,r?Error(`react-stack-top-frame`):F,r?M(i(e)):I)},e.jsxs=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!0,r?Error(`react-stack-top-frame`):F,r?M(i(e)):I)}})()})),i=e(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=n():t.exports=r()}))();function a({as:e=`div`,className:t=``,children:n,...r}){return(0,i.jsx)(e,{className:t,...r,children:n})}function o({header:e,footer:t,leftSidePanel:n,rightSidePanel:r,children:o,className:s=``,headerClassName:c=``,footerClassName:l=``,leftSidePanelClassName:u=``,rightSidePanelClassName:d=``,contentClassName:f=``,...p}){let m=e!=null&&e!==!1,h=t!=null&&t!==!1,g=n!=null&&n!==!1,_=r!=null&&r!==!1,v=[`nabs-ui-layout__body`,g&&_?`nabs-ui-layout__body--with-both-panels`:``,g&&!_?`nabs-ui-layout__body--with-left-panel`:``,!g&&_?`nabs-ui-layout__body--with-right-panel`:``].filter(Boolean).join(` `);return(0,i.jsxs)(`div`,{className:[`nabs-ui-layout`,s].filter(Boolean).join(` `),...p,children:[m?(0,i.jsx)(a,{as:`header`,className:`nabs-ui-layout__headerWrapper`,children:(0,i.jsx)(`div`,{className:[`nabs-ui-layout__header`,c].filter(Boolean).join(` `),children:e})}):null,(0,i.jsxs)(`div`,{className:v,children:[g?(0,i.jsx)(a,{as:`aside`,className:[`nabs-ui-layout__panel`,`nabs-ui-layout__panel--left`,u].filter(Boolean).join(` `),children:n}):null,(0,i.jsx)(a,{as:`section`,className:[`nabs-ui-layout__content`,f].filter(Boolean).join(` `),children:o}),_?(0,i.jsx)(a,{as:`aside`,className:[`nabs-ui-layout__panel`,`nabs-ui-layout__panel--right`,d].filter(Boolean).join(` `),children:r}):null]}),h?(0,i.jsx)(a,{as:`footer`,className:`nabs-ui-layout__footerWrapper`,children:(0,i.jsx)(`div`,{className:[`nabs-ui-layout__footer`,l].filter(Boolean).join(` `),children:t})}):null]})}var s=(0,t.forwardRef)(({header:e,navigation:t,footer:n,children:r,className:a=``,headerClassName:s=``,navigationClassName:c=``,contentClassName:l=``,footerClassName:u=``,...d},f)=>{let p=[`nabs-ui-shell`,a].filter(Boolean).join(` `),m=[`flex flex-wrap items-center justify-between gap-4 px-5 py-4`,s].filter(Boolean).join(` `),h=[`flex h-full min-h-0 flex-col gap-4 overflow-y-auto p-4`,c].filter(Boolean).join(` `),g=[`min-w-0`,l].filter(Boolean).join(` `),_=[`flex flex-wrap items-center justify-between gap-4 px-5 py-4`,u].filter(Boolean).join(` `);return(0,i.jsx)(`div`,{ref:f,className:p,...d,children:(0,i.jsx)(o,{className:`nabs-ui-shell__layout`,header:e,footer:n,leftSidePanel:t,headerClassName:m,footerClassName:_,leftSidePanelClassName:h,contentClassName:g,children:r})})});s.displayName=`Shell`,exports.Shell=s;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("@net-advantage/nabs-ui-layout/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=[`flex flex-wrap items-center justify-between gap-4 px-5 py-4`,s].filter(Boolean).join(` `),h=[`flex h-full min-h-0 flex-col gap-4 overflow-y-auto p-4`,c].filter(Boolean).join(` `),g=[`min-w-0`,l].filter(Boolean).join(` `),_=[`flex flex-wrap items-center justify-between gap-4 px-5 py-4`,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;

package/dist/nabs-ui-shell.css

@@ -1,78 +1,4 @@
-.nabs-ui-layout {
-  --nabs-ui-layout-gap: 1rem;
-  --nabs-ui-layout-border: #cbd5e1;
-  --nabs-ui-layout-surface: #ffffff;
-  --nabs-ui-layout-panel-surface: #f8fafc;
-  --nabs-ui-layout-content-surface: #ffffff;
-  --nabs-ui-layout-radius: 1rem;
-  display: grid;
-  gap: var(--nabs-ui-layout-gap);
-  min-width: 0;
-}
-
-.nabs-ui-layout__headerWrapper,
-.nabs-ui-layout__footerWrapper {
-  min-width: 0;
-}
-
-.nabs-ui-layout__header,
-.nabs-ui-layout__footer,
-.nabs-ui-layout__panel,
-.nabs-ui-layout__content {
-  border: 1px solid var(--nabs-ui-layout-border);
-  border-radius: var(--nabs-ui-layout-radius);
-  min-width: 0;
-}
-
-.nabs-ui-layout__header,
-.nabs-ui-layout__footer,
-.nabs-ui-layout__panel,
-.nabs-ui-layout__content {
-  box-sizing: border-box;
-  padding: 1rem;
-}
-
-.nabs-ui-layout__header,
-.nabs-ui-layout__footer {
-  background: var(--nabs-ui-layout-surface);
-}
-
-.nabs-ui-layout__body {
-  display: grid;
-  gap: var(--nabs-ui-layout-gap);
-  min-width: 0;
-}
-
-.nabs-ui-layout__body--with-both-panels {
-  grid-template-columns:
-    minmax(0, var(--nabs-ui-layout-left-panel-width, 18rem))
-    minmax(0, 1fr)
-    minmax(0, var(--nabs-ui-layout-right-panel-width, 18rem));
-}
-
-.nabs-ui-layout__body--with-left-panel {
-  grid-template-columns: minmax(0, var(--nabs-ui-layout-left-panel-width, 18rem)) minmax(0, 1fr);
-}
-
-.nabs-ui-layout__body--with-right-panel {
-  grid-template-columns: minmax(0, 1fr) minmax(0, var(--nabs-ui-layout-right-panel-width, 18rem));
-}
-
-.nabs-ui-layout__panel {
-  background: var(--nabs-ui-layout-panel-surface);
-}
-
-.nabs-ui-layout__content {
-  background: var(--nabs-ui-layout-content-surface);
-}
-
-.nabs-ui-layout__content > :first-child {
-  margin-top: 0;
-}
-
-.nabs-ui-layout__content > :last-child {
-  margin-bottom: 0;
-}/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
 @layer theme {
   :root, :host {
     --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
@@ -348,11 +274,11 @@
   }
 
   .min-h-0 {
-    min-height: 0;
+    min-height: calc(var(--spacing) * 0);
   }
 
   .min-w-0 {
-    min-width: 0;
+    min-width: calc(var(--spacing) * 0);
   }
 
   .flex-col {

package/dist/nabs-ui-shell.js

@@ -1,270 +1,26 @@
 import { forwardRef as e } from "react";
-//#region \0rolldown/runtime.js
-var t = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t.exports), n = /* @__PURE__ */ ((e) => typeof require < "u" ? require : typeof Proxy < "u" ? new Proxy(e, { get: (e, t) => (typeof require < "u" ? require : e)[t] }) : e)(function(e) {
-	if (typeof require < "u") return require.apply(this, arguments);
-	throw Error("Calling `require` for \"" + e + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
-}), r = /* @__PURE__ */ t(((e) => {
-	var t = Symbol.for("react.transitional.element"), n = Symbol.for("react.fragment");
-	function r(e, n, r) {
-		var i = null;
-		if (r !== void 0 && (i = "" + r), n.key !== void 0 && (i = "" + n.key), "key" in n) for (var a in r = {}, n) a !== "key" && (r[a] = n[a]);
-		else r = n;
-		return n = r.ref, {
-			$$typeof: t,
-			type: e,
-			key: i,
-			ref: n === void 0 ? null : n,
-			props: r
-		};
-	}
-	e.Fragment = n, e.jsx = r, e.jsxs = r;
-})), i = /* @__PURE__ */ t(((e) => {
-	process.env.NODE_ENV !== "production" && (function() {
-		function t(e) {
-			if (e == null) return null;
-			if (typeof e == "function") return e.$$typeof === k ? null : e.displayName || e.name || null;
-			if (typeof e == "string") return e;
-			switch (e) {
-				case v: return "Fragment";
-				case b: return "Profiler";
-				case y: return "StrictMode";
-				case w: return "Suspense";
-				case T: return "SuspenseList";
-				case O: return "Activity";
-			}
-			if (typeof e == "object") switch (typeof e.tag == "number" && console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), e.$$typeof) {
-				case _: return "Portal";
-				case S: return e.displayName || "Context";
-				case x: return (e._context.displayName || "Context") + ".Consumer";
-				case C:
-					var n = e.render;
-					return e = e.displayName, e ||= (e = n.displayName || n.name || "", e === "" ? "ForwardRef" : "ForwardRef(" + e + ")"), e;
-				case E: return n = e.displayName || null, n === null ? t(e.type) || "Memo" : n;
-				case D:
-					n = e._payload, e = e._init;
-					try {
-						return t(e(n));
-					} catch {}
-			}
-			return null;
-		}
-		function r(e) {
-			return "" + e;
-		}
-		function i(e) {
-			try {
-				r(e);
-				var t = !1;
-			} catch {
-				t = !0;
-			}
-			if (t) {
-				t = console;
-				var n = t.error, i = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
-				return n.call(t, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", i), r(e);
-			}
-		}
-		function a(e) {
-			if (e === v) return "<>";
-			if (typeof e == "object" && e && e.$$typeof === D) return "<...>";
-			try {
-				var n = t(e);
-				return n ? "<" + n + ">" : "<...>";
-			} catch {
-				return "<...>";
-			}
-		}
-		function o() {
-			var e = A.A;
-			return e === null ? null : e.getOwner();
-		}
-		function s() {
-			return Error("react-stack-top-frame");
-		}
-		function c(e) {
-			if (j.call(e, "key")) {
-				var t = Object.getOwnPropertyDescriptor(e, "key").get;
-				if (t && t.isReactWarning) return !1;
-			}
-			return e.key !== void 0;
-		}
-		function l(e, t) {
-			function n() {
-				P || (P = !0, console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)", t));
-			}
-			n.isReactWarning = !0, Object.defineProperty(e, "key", {
-				get: n,
-				configurable: !0
-			});
-		}
-		function u() {
-			var e = t(this.type);
-			return F[e] || (F[e] = !0, console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")), e = this.props.ref, e === void 0 ? null : e;
-		}
-		function d(e, t, n, r, i, a) {
-			var o = n.ref;
-			return e = {
-				$$typeof: g,
-				type: e,
-				key: t,
-				props: n,
-				_owner: r
-			}, (o === void 0 ? null : o) === null ? Object.defineProperty(e, "ref", {
-				enumerable: !1,
-				value: null
-			}) : Object.defineProperty(e, "ref", {
-				enumerable: !1,
-				get: u
-			}), e._store = {}, Object.defineProperty(e._store, "validated", {
-				configurable: !1,
-				enumerable: !1,
-				writable: !0,
-				value: 0
-			}), Object.defineProperty(e, "_debugInfo", {
-				configurable: !1,
-				enumerable: !1,
-				writable: !0,
-				value: null
-			}), Object.defineProperty(e, "_debugStack", {
-				configurable: !1,
-				enumerable: !1,
-				writable: !0,
-				value: i
-			}), Object.defineProperty(e, "_debugTask", {
-				configurable: !1,
-				enumerable: !1,
-				writable: !0,
-				value: a
-			}), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
-		}
-		function f(e, n, r, a, s, u) {
-			var f = n.children;
-			if (f !== void 0) if (a) if (M(f)) {
-				for (a = 0; a < f.length; a++) p(f[a]);
-				Object.freeze && Object.freeze(f);
-			} else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
-			else p(f);
-			if (j.call(n, "key")) {
-				f = t(e);
-				var m = Object.keys(n).filter(function(e) {
-					return e !== "key";
-				});
-				a = 0 < m.length ? "{key: someKey, " + m.join(": ..., ") + ": ...}" : "{key: someKey}", R[f + a] || (m = 0 < m.length ? "{" + m.join(": ..., ") + ": ...}" : "{}", console.error("A props object containing a \"key\" prop is being spread into JSX:\n  let props = %s;\n  <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n  let props = %s;\n  <%s key={someKey} {...props} />", a, f, m, f), R[f + a] = !0);
-			}
-			if (f = null, r !== void 0 && (i(r), f = "" + r), c(n) && (i(n.key), f = "" + n.key), "key" in n) for (var h in r = {}, n) h !== "key" && (r[h] = n[h]);
-			else r = n;
-			return f && l(r, typeof e == "function" ? e.displayName || e.name || "Unknown" : e), d(e, f, r, o(), s, u);
-		}
-		function p(e) {
-			m(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e && e.$$typeof === D && (e._payload.status === "fulfilled" ? m(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
-		}
-		function m(e) {
-			return typeof e == "object" && !!e && e.$$typeof === g;
-		}
-		var h = n("react"), g = Symbol.for("react.transitional.element"), _ = Symbol.for("react.portal"), v = Symbol.for("react.fragment"), y = Symbol.for("react.strict_mode"), b = Symbol.for("react.profiler"), x = Symbol.for("react.consumer"), S = Symbol.for("react.context"), C = Symbol.for("react.forward_ref"), w = Symbol.for("react.suspense"), T = Symbol.for("react.suspense_list"), E = Symbol.for("react.memo"), D = Symbol.for("react.lazy"), O = Symbol.for("react.activity"), k = Symbol.for("react.client.reference"), A = h.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, j = Object.prototype.hasOwnProperty, M = Array.isArray, N = console.createTask ? console.createTask : function() {
-			return null;
-		};
-		h = { react_stack_bottom_frame: function(e) {
-			return e();
-		} };
-		var P, F = {}, I = h.react_stack_bottom_frame.bind(h, s)(), L = N(a(s)), R = {};
-		e.Fragment = v, e.jsx = function(e, t, n) {
-			var r = 1e4 > A.recentlyCreatedOwnerStacks++;
-			return f(e, t, n, !1, r ? Error("react-stack-top-frame") : I, r ? N(a(e)) : L);
-		}, e.jsxs = function(e, t, n) {
-			var r = 1e4 > A.recentlyCreatedOwnerStacks++;
-			return f(e, t, n, !0, r ? Error("react-stack-top-frame") : I, r ? N(a(e)) : L);
-		};
-	})();
-})), a = (/* @__PURE__ */ t(((e, t) => {
-	process.env.NODE_ENV === "production" ? t.exports = r() : t.exports = i();
-})))();
-function o({ as: e = "div", className: t = "", children: n, ...r }) {
-	return /* @__PURE__ */ (0, a.jsx)(e, {
-		className: t,
-		...r,
-		children: n
-	});
-}
-function s({ header: e, footer: t, leftSidePanel: n, rightSidePanel: r, children: i, className: s = "", headerClassName: c = "", footerClassName: l = "", leftSidePanelClassName: u = "", rightSidePanelClassName: d = "", contentClassName: f = "", ...p }) {
-	let m = e != null && e !== !1, h = t != null && t !== !1, g = n != null && n !== !1, _ = r != null && r !== !1, v = [
-		"nabs-ui-layout__body",
-		g && _ ? "nabs-ui-layout__body--with-both-panels" : "",
-		g && !_ ? "nabs-ui-layout__body--with-left-panel" : "",
-		!g && _ ? "nabs-ui-layout__body--with-right-panel" : ""
-	].filter(Boolean).join(" ");
-	return /* @__PURE__ */ (0, a.jsxs)("div", {
-		className: ["nabs-ui-layout", s].filter(Boolean).join(" "),
-		...p,
-		children: [
-			m ? /* @__PURE__ */ (0, a.jsx)(o, {
-				as: "header",
-				className: "nabs-ui-layout__headerWrapper",
-				children: /* @__PURE__ */ (0, a.jsx)("div", {
-					className: ["nabs-ui-layout__header", c].filter(Boolean).join(" "),
-					children: e
-				})
-			}) : null,
-			/* @__PURE__ */ (0, a.jsxs)("div", {
-				className: v,
-				children: [
-					g ? /* @__PURE__ */ (0, a.jsx)(o, {
-						as: "aside",
-						className: [
-							"nabs-ui-layout__panel",
-							"nabs-ui-layout__panel--left",
-							u
-						].filter(Boolean).join(" "),
-						children: n
-					}) : null,
-					/* @__PURE__ */ (0, a.jsx)(o, {
-						as: "section",
-						className: ["nabs-ui-layout__content", f].filter(Boolean).join(" "),
-						children: i
-					}),
-					_ ? /* @__PURE__ */ (0, a.jsx)(o, {
-						as: "aside",
-						className: [
-							"nabs-ui-layout__panel",
-							"nabs-ui-layout__panel--right",
-							d
-						].filter(Boolean).join(" "),
-						children: r
-					}) : null
-				]
-			}),
-			h ? /* @__PURE__ */ (0, a.jsx)(o, {
-				as: "footer",
-				className: "nabs-ui-layout__footerWrapper",
-				children: /* @__PURE__ */ (0, a.jsx)("div", {
-					className: ["nabs-ui-layout__footer", l].filter(Boolean).join(" "),
-					children: t
-				})
-			}) : null
-		]
-	});
-}
-//#endregion
+import { Layout as t } from "@net-advantage/nabs-ui-layout/Layout";
+import { jsx as n } from "react/jsx-runtime";
 //#region src/Shell.tsx
-var c = e(({ header: e, navigation: t, footer: n, children: r, className: i = "", headerClassName: o = "", navigationClassName: c = "", contentClassName: l = "", footerClassName: u = "", ...d }, f) => {
-	let p = ["nabs-ui-shell", i].filter(Boolean).join(" "), m = ["flex flex-wrap items-center justify-between gap-4 px-5 py-4", o].filter(Boolean).join(" "), h = ["flex h-full min-h-0 flex-col gap-4 overflow-y-auto p-4", c].filter(Boolean).join(" "), g = ["min-w-0", l].filter(Boolean).join(" "), _ = ["flex flex-wrap items-center justify-between gap-4 px-5 py-4", u].filter(Boolean).join(" ");
-	return /* @__PURE__ */ (0, a.jsx)("div", {
+var r = e(({ 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 = ["flex flex-wrap items-center justify-between gap-4 px-5 py-4", s].filter(Boolean).join(" "), h = ["flex h-full min-h-0 flex-col gap-4 overflow-y-auto p-4", c].filter(Boolean).join(" "), g = ["min-w-0", l].filter(Boolean).join(" "), _ = ["flex flex-wrap items-center justify-between gap-4 px-5 py-4", u].filter(Boolean).join(" ");
+	return /* @__PURE__ */ n("div", {
 		ref: f,
 		className: p,
 		...d,
-		children: /* @__PURE__ */ (0, a.jsx)(s, {
+		children: /* @__PURE__ */ n(t, {
 			className: "nabs-ui-shell__layout",
 			header: e,
-			footer: n,
-			leftSidePanel: t,
+			footer: i,
+			leftSidePanel: r,
 			headerClassName: m,
 			footerClassName: _,
 			leftSidePanelClassName: h,
 			contentClassName: g,
-			children: r
+			children: a
 		})
 	});
 });
-c.displayName = "Shell";
+r.displayName = "Shell";
 //#endregion
-export { c as Shell };
+export { r as Shell };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@net-advantage/nabs-ui-shell",
-  "version": "0.1.0",
+  "version": "0.19.0",
   "description": "Reusable React app shell for the Nabs UI library.",
   "type": "module",
   "main": "./dist/nabs-ui-shell.cjs",
@@ -16,13 +16,9 @@
   "files": [
     "dist"
   ],
-  "scripts": {
-    "build": "vite build",
-    "dev": "vite"
-  },
   "dependencies": {
-    "nabs-ui-layout": "file:../nabs-ui-layout",
-    "react": "^19.0.0"
+    "react": "^19.0.0",
+    "@net-advantage/nabs-ui-layout": "0.19.0"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.1.0",
@@ -30,5 +26,9 @@
     "react-dom": "^19.2.6",
     "tailwindcss": "^4.1.0",
     "vite": "^8.0.12"
+  },
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite"
   }
 }