@pathscale/ui 0.0.154 → 0.0.156

package/dist/components/glass-panel/GlassPanel.d.ts

@@ -13,6 +13,8 @@ export type GlassPanelProps = IComponentBaseProps & JSX.HTMLAttributes<HTMLDivEl
     transparent?: boolean;
     glow?: boolean;
     accent?: ComponentColor;
+    paddingX?: string;
+    paddingY?: string;
 };
 declare const GlassPanel: (props: GlassPanelProps) => JSX.Element;
 export default GlassPanel;

package/dist/components/noise-background/NoiseBackground.d.ts

@@ -18,6 +18,8 @@ export type NoiseBackgroundProps = {
     borderRadius?: string;
     /** Path or URL to the noise texture image. @default "/noise.webp" */
     noiseSrc?: string;
+    /** Show the static noise texture overlay. @default false */
+    showNoise?: boolean;
 } & IComponentBaseProps;
 declare const NoiseBackground: (rawProps: NoiseBackgroundProps) => JSX.Element;
 export default NoiseBackground;

package/dist/index.js

@@ -10924,7 +10924,7 @@ const floating_dock_FloatingDock = FloatingDock;
     "click",
     "mousemove"
 ]);
-var GlassPanel_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<button type=button class="flex w-full items-center justify-between gap-2 px-4 py-3 text-sm font-medium cursor-pointer select-none transition-colors duration-150 text-base-content/50 hover:text-base-content/80 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary"><span class="flex items-center gap-2"></span><svg fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=1.5><path stroke-linecap=round stroke-linejoin=round d="M19 9l-7 7-7-7">'), GlassPanel_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div class="grid transition-[grid-template-rows] duration-200 ease-in-out"><div>');
+var GlassPanel_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<button type=button class="flex w-full items-center justify-between gap-2 px-4 py-3 text-sm font-medium cursor-pointer select-none transition-colors duration-150 text-base-content/50 hover:text-base-content/80 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary"><span class="flex items-center gap-2"></span><svg fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=1.5><path stroke-linecap=round stroke-linejoin=round d="M19 9l-7 7-7-7">'), GlassPanel_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div><div><div class=overflow-hidden>");
 const BLUR_MAP = {
     none: "",
     sm: "backdrop-blur-sm",
@@ -10964,6 +10964,8 @@ const GlassPanel = (props)=>{
         "transparent",
         "glow",
         "accent",
+        "paddingX",
+        "paddingY",
         "children",
         "class",
         "className",
@@ -10998,7 +11000,7 @@ const GlassPanel = (props)=>{
         if (local.glow) base["box-shadow"] = "inset 0 1px 0 color-mix(in srgb, var(--color-base-content) 5%, transparent)";
         return base;
     };
-    const contentClasses = ()=>twMerge(SIZE_PADDING[size()]);
+    const contentClasses = ()=>twMerge(local.paddingX || local.paddingY ? "" : SIZE_PADDING[size()], local.paddingX, local.paddingY);
     return (()=>{
         var _el$ = GlassPanel_tmpl$2(), _el$5 = _el$.firstChild, _el$6 = _el$5.firstChild;
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
@@ -11046,13 +11048,15 @@ const GlassPanel = (props)=>{
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$5, "id", contentId);
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$6, ()=>local.children);
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
-            var _v$3 = !local.collapsible || isOpen() ? "1fr" : "0fr", _v$4 = `${!local.collapsible || isOpen() ? "overflow-visible" : "overflow-hidden"} ${contentClasses()}`;
-            _v$3 !== _p$.e && (null != (_p$.e = _v$3) ? _el$5.style.setProperty("grid-template-rows", _v$3) : _el$5.style.removeProperty("grid-template-rows"));
-            _v$4 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$6, _p$.t = _v$4);
+            var _v$3 = `grid transition-[grid-template-rows,opacity] duration-200 ease-in-out overflow-hidden ${local.collapsible && !isOpen() ? "" : contentClasses()}`, _v$4 = !local.collapsible || isOpen() ? "1fr" : "0fr", _v$5 = !local.collapsible || isOpen() ? "1" : "0";
+            _v$3 !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$5, _p$.e = _v$3);
+            _v$4 !== _p$.t && (null != (_p$.t = _v$4) ? _el$5.style.setProperty("grid-template-rows", _v$4) : _el$5.style.removeProperty("grid-template-rows"));
+            _v$5 !== _p$.a && (null != (_p$.a = _v$5) ? _el$5.style.setProperty("opacity", _v$5) : _el$5.style.removeProperty("opacity"));
             return _p$;
         }, {
             e: void 0,
-            t: void 0
+            t: void 0,
+            a: void 0
         });
         return _el$;
     })();
@@ -14573,7 +14577,7 @@ const navbar_Navbar = Object.assign(Navbar, {
     Stack: NavbarStack,
     Row: navbar_NavbarRow
 });
-var NoiseBackground_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div class="absolute inset-0 opacity-40"></div><div class="absolute inset-0 opacity-30"></div><div class="absolute inset-0 opacity-25"></div><div class="absolute inset-x-0 top-0 h-1 opacity-80 blur-sm"></div><div class="pointer-events-none absolute inset-0 overflow-hidden"><img alt class="h-full w-full object-cover"></div><div>');
+var NoiseBackground_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div class="absolute inset-0 opacity-40"></div><div class="absolute inset-0 opacity-30"></div><div class="absolute inset-0 opacity-25"></div><div class="absolute inset-x-0 top-0 h-1 opacity-80 blur-sm"></div><div>'), NoiseBackground_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="pointer-events-none absolute inset-0 overflow-hidden"><img alt class="h-full w-full object-cover">');
 function NoiseBackground_createSpring(initial, stiffness = 100, damping = 30) {
     let current = initial;
     let velocity = 0;
@@ -14604,6 +14608,7 @@ const NoiseBackground = (rawProps)=>{
         "animating",
         "borderRadius",
         "noiseSrc",
+        "showNoise",
         "dataTheme",
         "style"
     ]);
@@ -14712,7 +14717,7 @@ const NoiseBackground = (rawProps)=>{
     const containerClasses = ()=>twMerge("group relative overflow-hidden bg-base-200 backdrop-blur-sm", "shadow-[0px_1px_0px_0px_var(--color-base-300)_inset,0px_1px_0px_0px_var(--color-base-100)]", local.containerClass);
     const contentClasses = ()=>twMerge("relative z-10", local.class, local.className);
     return (()=>{
-        var _el$ = NoiseBackground_tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling, _el$7 = _el$6.firstChild, _el$8 = _el$6.nextSibling;
+        var _el$ = NoiseBackground_tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling;
         var _ref$ = containerRef;
         "function" == typeof _ref$ ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$, _el$) : containerRef = _el$;
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
@@ -14743,21 +14748,27 @@ const NoiseBackground = (rawProps)=>{
         "function" == typeof _ref$4 ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$4, _el$4) : layer2 = _el$4;
         var _ref$5 = stripEl;
         "function" == typeof _ref$5 ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$5, _el$5) : stripEl = _el$5;
-        _el$7.style.setProperty("opacity", "var(--noise-opacity, 0.2)");
-        _el$7.style.setProperty("mix-blend-mode", "overlay");
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$8, ()=>local.children);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!(local.showNoise ?? false));
+            return ()=>_c$() && (()=>{
+                    var _el$7 = NoiseBackground_tmpl$2(), _el$8 = _el$7.firstChild;
+                    _el$8.style.setProperty("opacity", "var(--noise-opacity, 0.2)");
+                    _el$8.style.setProperty("mix-blend-mode", "overlay");
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$8, "src", local.noiseSrc ?? "/noise.webp"));
+                    return _el$7;
+                })();
+        })(), _el$6);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$6, ()=>local.children);
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
-            var _v$ = `linear-gradient(to right, ${colors().join(", ")})`, _v$2 = `${borderRadius()} ${borderRadius()} 0 0`, _v$3 = local.noiseSrc ?? "/noise.webp", _v$4 = contentClasses();
+            var _v$ = `linear-gradient(to right, ${colors().join(", ")})`, _v$2 = `${borderRadius()} ${borderRadius()} 0 0`, _v$3 = contentClasses();
             _v$ !== _p$.e && (null != (_p$.e = _v$) ? _el$5.style.setProperty("background", _v$) : _el$5.style.removeProperty("background"));
             _v$2 !== _p$.t && (null != (_p$.t = _v$2) ? _el$5.style.setProperty("border-radius", _v$2) : _el$5.style.removeProperty("border-radius"));
-            _v$3 !== _p$.a && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$7, "src", _p$.a = _v$3);
-            _v$4 !== _p$.o && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$8, _p$.o = _v$4);
+            _v$3 !== _p$.a && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$6, _p$.a = _v$3);
             return _p$;
         }, {
             e: void 0,
             t: void 0,
-            a: void 0,
-            o: void 0
+            a: void 0
         });
         return _el$;
     })();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pathscale/ui",
-  "version": "0.0.154",
+  "version": "0.0.156",
   "author": "pathscale",
   "repository": {
     "type": "git",