@skdx/react-blocks 0.39.0 → 0.40.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.
@@ -1,2 +1,2 @@
1
1
  'use client';
2
- "use strict";var R=Object.create;var u=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var $=(t,a)=>{for(var o in a)u(t,o,{get:a[o],enumerable:!0})},y=(t,a,o,r)=>{if(a&&typeof a=="object"||typeof a=="function")for(let d of L(a))!I.call(t,d)&&d!==o&&u(t,d,{get:()=>a[d],enumerable:!(r=T(a,d))||r.enumerable});return t};var p=(t,a,o)=>(o=t!=null?R(S(t)):{},y(a||!t||!t.__esModule?u(o,"default",{value:t,enumerable:!0}):o,t)),A=t=>y(u({},"__esModule",{value:!0}),t);var C={};$(C,{DashboardLayout:()=>c});module.exports=A(C);var k=p(require("react"),1),x=require("@skdx/react");function O(...t){let a="";for(let o of t)o&&(a=a?`${a} ${o}`:o);return a}function e(t,a,o){let r=a==="root",d=r?`skdx-${t}`:`skdx-${t}__${a}`,s={className:O(d,o),"data-part":a};return r&&(s["data-skdx-component"]=t),s}var g=p(require("react"),1);function m(t,a,o){let[r,d]=g.useState(a),s=t!==void 0;return[s?t:r,i=>{s||d(i),o?.(i)}]}var n=require("react/jsx-runtime");function N({items:t}){return(0,n.jsx)("ul",{...e("dashboard-layout","nav-list"),children:t.map((a,o)=>{let r=a.kind??"item";return r==="divider"?(0,n.jsx)("li",{children:(0,n.jsx)("hr",{...e("dashboard-layout","nav-divider")})},o):r==="header"?(0,n.jsx)("li",{...e("dashboard-layout","nav-header"),children:a.label},o):(0,n.jsxs)("li",{children:[a.href===void 0?(0,n.jsx)("span",{...e("dashboard-layout","nav-item"),children:a.label}):(0,n.jsx)("a",{href:a.href,"aria-current":a.current?"page":void 0,...e("dashboard-layout","nav-item"),children:a.label}),a.href===void 0&&a.children&&a.children.length>0?(0,n.jsx)(N,{items:a.children}):null]},o)})})}var c=({title:t,navigation:a,navOpen:o,defaultNavOpen:r=!0,navLabel:d="Main navigation",navToggleLabel:s="Toggle navigation",onNavOpenChange:b,branding:h,actions:i,children:D,...v})=>{let f=k.useId(),[l,P]=m(o,r,b);return(0,n.jsxs)("div",{"data-nav-open":l?"":void 0,...v,...e("dashboard-layout","root",v.className),children:[(0,n.jsxs)("header",{...e("dashboard-layout","app-bar"),children:[(0,n.jsx)(x.Button,{iconOnly:!0,"aria-expanded":l,"aria-controls":f,"aria-label":s,onClick:()=>{P(!l)},...e("dashboard-layout","nav-toggle"),children:"\u2630"}),(0,n.jsx)("div",{...e("dashboard-layout","branding"),children:h}),t?(0,n.jsx)("span",{...e("dashboard-layout","title"),children:t}):null,(0,n.jsx)("div",{...e("dashboard-layout","actions"),children:i})]}),(0,n.jsxs)("div",{...e("dashboard-layout","body"),children:[(0,n.jsx)("nav",{id:f,"aria-label":d,hidden:!l,...e("dashboard-layout","nav"),children:(0,n.jsx)(N,{items:a})}),(0,n.jsx)("main",{...e("dashboard-layout","content"),children:D})]})]})};c.displayName="DashboardLayout";0&&(module.exports={DashboardLayout});
2
+ "use strict";var L=Object.create;var u=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var I=Object.getPrototypeOf,$=Object.prototype.hasOwnProperty;var A=(t,a)=>{for(var o in a)u(t,o,{get:a[o],enumerable:!0})},y=(t,a,o,r)=>{if(a&&typeof a=="object"||typeof a=="function")for(let d of C(a))!$.call(t,d)&&d!==o&&u(t,d,{get:()=>a[d],enumerable:!(r=S(a,d))||r.enumerable});return t};var p=(t,a,o)=>(o=t!=null?L(I(t)):{},y(a||!t||!t.__esModule?u(o,"default",{value:t,enumerable:!0}):o,t)),O=t=>y(u({},"__esModule",{value:!0}),t);var V={};A(V,{DashboardLayout:()=>c});module.exports=O(V);var k=p(require("react"),1),x=require("@skdx/react");function B(...t){let a="";for(let o of t)o&&(a=a?`${a} ${o}`:o);return a}function e(t,a,o){let r=a==="root",d=r?`skdx-${t}`:`skdx-${t}__${a}`,i={className:B(d,o),"data-part":a};return r&&(i["data-skdx-component"]=t),i}var g=p(require("react"),1);function m(t,a,o){let[r,d]=g.useState(a),i=t!==void 0;return[i?t:r,s=>{i||d(s),o?.(s)}]}var n=require("react/jsx-runtime");function N({items:t}){return(0,n.jsx)("ul",{...e("dashboard-layout","nav-list"),children:t.map((a,o)=>{let r=a.kind??"item";return r==="divider"?(0,n.jsx)("li",{children:(0,n.jsx)("hr",{...e("dashboard-layout","nav-divider")})},o):r==="header"?(0,n.jsx)("li",{...e("dashboard-layout","nav-header"),children:a.label},o):(0,n.jsxs)("li",{children:[a.href===void 0?(0,n.jsx)("span",{...e("dashboard-layout","nav-item"),children:a.label}):(0,n.jsx)("a",{href:a.href,"aria-current":a.current?"page":void 0,...e("dashboard-layout","nav-item"),children:a.label}),a.href===void 0&&a.children&&a.children.length>0?(0,n.jsx)(N,{items:a.children}):null]},o)})})}var c=({title:t,navigation:a,contentAs:o="main",navOpen:r,defaultNavOpen:d=!0,navLabel:i="Main navigation",navToggleLabel:v="Toggle navigation",onNavOpenChange:b,branding:s,actions:D,children:P,...h})=>{let R=o==="div"?"div":"main",f=k.useId(),[l,T]=m(r,d,b);return(0,n.jsxs)("div",{"data-nav-open":l?"":void 0,...h,...e("dashboard-layout","root",h.className),children:[(0,n.jsxs)("header",{...e("dashboard-layout","app-bar"),children:[(0,n.jsx)(x.Button,{iconOnly:!0,"aria-expanded":l,"aria-controls":f,"aria-label":v,onClick:()=>{T(!l)},...e("dashboard-layout","nav-toggle"),children:"\u2630"}),(0,n.jsx)("div",{...e("dashboard-layout","branding"),children:s}),t?(0,n.jsx)("span",{...e("dashboard-layout","title"),children:t}):null,(0,n.jsx)("div",{...e("dashboard-layout","actions"),children:D})]}),(0,n.jsxs)("div",{...e("dashboard-layout","body"),children:[(0,n.jsx)("nav",{id:f,"aria-label":i,hidden:!l,...e("dashboard-layout","nav"),children:(0,n.jsx)(N,{items:a})}),(0,n.jsx)(R,{...e("dashboard-layout","content"),children:P})]})]})};c.displayName="DashboardLayout";0&&(module.exports={DashboardLayout});
@@ -15,6 +15,6 @@ import type { DashboardLayoutProps } from './types.cjs';
15
15
  * ```
16
16
  */
17
17
  export declare const DashboardLayout: {
18
- ({ title, navigation, navOpen: navOpenProp, defaultNavOpen, navLabel, navToggleLabel, onNavOpenChange, branding, actions, children, ...props }: DashboardLayoutProps): React.ReactNode;
18
+ ({ title, navigation, contentAs, navOpen: navOpenProp, defaultNavOpen, navLabel, navToggleLabel, onNavOpenChange, branding, actions, children, ...props }: DashboardLayoutProps): React.ReactNode;
19
19
  displayName: string;
20
20
  };
@@ -15,6 +15,6 @@ import type { DashboardLayoutProps } from './types.js';
15
15
  * ```
16
16
  */
17
17
  export declare const DashboardLayout: {
18
- ({ title, navigation, navOpen: navOpenProp, defaultNavOpen, navLabel, navToggleLabel, onNavOpenChange, branding, actions, children, ...props }: DashboardLayoutProps): React.ReactNode;
18
+ ({ title, navigation, contentAs, navOpen: navOpenProp, defaultNavOpen, navLabel, navToggleLabel, onNavOpenChange, branding, actions, children, ...props }: DashboardLayoutProps): React.ReactNode;
19
19
  displayName: string;
20
20
  };
@@ -1,2 +1,2 @@
1
1
  'use client';
2
- import*as p from"react";import{Button as D}from"@skdx/react";function N(...n){let a="";for(let e of n)e&&(a=a?`${a} ${e}`:e);return a}function t(n,a,e){let r=a==="root",s=r?`skdx-${n}`:`skdx-${n}__${a}`,d={className:N(s,e),"data-part":a};return r&&(d["data-skdx-component"]=n),d}import*as f from"react";function y(n,a,e){let[r,s]=f.useState(a),d=n!==void 0;return[d?n:r,i=>{d||s(i),e?.(i)}]}import{jsx as o,jsxs as u}from"react/jsx-runtime";function g({items:n}){return o("ul",{...t("dashboard-layout","nav-list"),children:n.map((a,e)=>{let r=a.kind??"item";return r==="divider"?o("li",{children:o("hr",{...t("dashboard-layout","nav-divider")})},e):r==="header"?o("li",{...t("dashboard-layout","nav-header"),children:a.label},e):u("li",{children:[a.href===void 0?o("span",{...t("dashboard-layout","nav-item"),children:a.label}):o("a",{href:a.href,"aria-current":a.current?"page":void 0,...t("dashboard-layout","nav-item"),children:a.label}),a.href===void 0&&a.children&&a.children.length>0?o(g,{items:a.children}):null]},e)})})}var m=({title:n,navigation:a,navOpen:e,defaultNavOpen:r=!0,navLabel:s="Main navigation",navToggleLabel:d="Toggle navigation",onNavOpenChange:c,branding:b,actions:i,children:k,...h})=>{let v=p.useId(),[l,x]=y(e,r,c);return u("div",{"data-nav-open":l?"":void 0,...h,...t("dashboard-layout","root",h.className),children:[u("header",{...t("dashboard-layout","app-bar"),children:[o(D,{iconOnly:!0,"aria-expanded":l,"aria-controls":v,"aria-label":d,onClick:()=>{x(!l)},...t("dashboard-layout","nav-toggle"),children:"\u2630"}),o("div",{...t("dashboard-layout","branding"),children:b}),n?o("span",{...t("dashboard-layout","title"),children:n}):null,o("div",{...t("dashboard-layout","actions"),children:i})]}),u("div",{...t("dashboard-layout","body"),children:[o("nav",{id:v,"aria-label":s,hidden:!l,...t("dashboard-layout","nav"),children:o(g,{items:a})}),o("main",{...t("dashboard-layout","content"),children:k})]})]})};m.displayName="DashboardLayout";export{m as DashboardLayout};
2
+ import*as p from"react";import{Button as R}from"@skdx/react";function P(...n){let a="";for(let e of n)e&&(a=a?`${a} ${e}`:e);return a}function t(n,a,e){let r=a==="root",i=r?`skdx-${n}`:`skdx-${n}__${a}`,d={className:P(i,e),"data-part":a};return r&&(d["data-skdx-component"]=n),d}import*as f from"react";function y(n,a,e){let[r,i]=f.useState(a),d=n!==void 0;return[d?n:r,s=>{d||i(s),e?.(s)}]}import{jsx as o,jsxs as u}from"react/jsx-runtime";function g({items:n}){return o("ul",{...t("dashboard-layout","nav-list"),children:n.map((a,e)=>{let r=a.kind??"item";return r==="divider"?o("li",{children:o("hr",{...t("dashboard-layout","nav-divider")})},e):r==="header"?o("li",{...t("dashboard-layout","nav-header"),children:a.label},e):u("li",{children:[a.href===void 0?o("span",{...t("dashboard-layout","nav-item"),children:a.label}):o("a",{href:a.href,"aria-current":a.current?"page":void 0,...t("dashboard-layout","nav-item"),children:a.label}),a.href===void 0&&a.children&&a.children.length>0?o(g,{items:a.children}):null]},e)})})}var m=({title:n,navigation:a,contentAs:e="main",navOpen:r,defaultNavOpen:i=!0,navLabel:d="Main navigation",navToggleLabel:c="Toggle navigation",onNavOpenChange:v,branding:s,actions:k,children:x,...b})=>{let N=e==="div"?"div":"main",h=p.useId(),[l,D]=y(r,i,v);return u("div",{"data-nav-open":l?"":void 0,...b,...t("dashboard-layout","root",b.className),children:[u("header",{...t("dashboard-layout","app-bar"),children:[o(R,{iconOnly:!0,"aria-expanded":l,"aria-controls":h,"aria-label":c,onClick:()=>{D(!l)},...t("dashboard-layout","nav-toggle"),children:"\u2630"}),o("div",{...t("dashboard-layout","branding"),children:s}),n?o("span",{...t("dashboard-layout","title"),children:n}):null,o("div",{...t("dashboard-layout","actions"),children:k})]}),u("div",{...t("dashboard-layout","body"),children:[o("nav",{id:h,"aria-label":d,hidden:!l,...t("dashboard-layout","nav"),children:o(g,{items:a})}),o(N,{...t("dashboard-layout","content"),children:x})]})]})};m.displayName="DashboardLayout";export{m as DashboardLayout};
@@ -38,6 +38,11 @@ export interface DashboardLayoutProps extends React.ComponentPropsWithRef<'div'>
38
38
  title?: string | undefined;
39
39
  /** The side navigation, in render order, one entry per link, group label or separator. */
40
40
  navigation: DashboardNavigationItem[];
41
+ /**
42
+ * Content element: use `div` when embedding inside an existing page main landmark.
43
+ * @default 'main'
44
+ */
45
+ contentAs?: 'main' | 'div' | undefined;
41
46
  /**
42
47
  * Whether the side navigation is shown, for controlled usage paired with `onNavOpenChange`.
43
48
  * @default undefined — uncontrolled, seeded from `defaultNavOpen`.
@@ -38,6 +38,11 @@ export interface DashboardLayoutProps extends React.ComponentPropsWithRef<'div'>
38
38
  title?: string | undefined;
39
39
  /** The side navigation, in render order, one entry per link, group label or separator. */
40
40
  navigation: DashboardNavigationItem[];
41
+ /**
42
+ * Content element: use `div` when embedding inside an existing page main landmark.
43
+ * @default 'main'
44
+ */
45
+ contentAs?: 'main' | 'div' | undefined;
41
46
  /**
42
47
  * Whether the side navigation is shown, for controlled usage paired with `onNavOpenChange`.
43
48
  * @default undefined — uncontrolled, seeded from `defaultNavOpen`.
@@ -1,2 +1,2 @@
1
1
  'use client';
2
- "use strict";var ee=Object.create;var g=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var oe=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,ne=Object.prototype.hasOwnProperty;var ae=(e,t)=>{for(var r in t)g(e,r,{get:t[r],enumerable:!0})},W=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of oe(t))!ne.call(e,s)&&s!==r&&g(e,s,{get:()=>t[s],enumerable:!(n=te(t,s))||n.enumerable});return e};var T=(e,t,r)=>(r=e!=null?ee(re(e)):{},W(t||!e||!e.__esModule?g(r,"default",{value:e,enumerable:!0}):r,e)),se=e=>W(g({},"__esModule",{value:!0}),e);var le={};ae(le,{WorkspaceSwitcher:()=>S});module.exports=se(le);var f=T(require("react"),1),O=require("@skdx/react"),i=require("@skdx/react/primitives/command"),m=require("@skdx/react/primitives/popover");function ie(...e){let t="";for(let r of e)r&&(t=t?`${t} ${r}`:r);return t}function a(e,t,r){let n=t==="root",s=n?`skdx-${e}`:`skdx-${e}__${t}`,d={className:ie(s,r),"data-part":t};return n&&(d["data-skdx-component"]=e),d}var N=require("react/jsx-runtime"),b=({part:e,children:t})=>t?(0,N.jsx)("div",{...e,children:t}):null;b.displayName="Region";var A=T(require("react"),1);function R(e,t,r){let[n,s]=A.useState(t),d=e!==void 0;return[d?e:n,h=>{d||s(h),r?.(h)}]}var o=require("react/jsx-runtime");function ce(e,t){let r=t.toLowerCase(),n=new Map([[void 0,[]]]);for(let c of e){let u=n.get(c.group);u?u.push(c):n.set(c.group,[c])}let s=c=>r===""||c.id.toLowerCase().includes(r)||c.label.toLowerCase().includes(r)||(c.description?.toLowerCase().includes(r)??!1),d=[];for(let[c,u]of n)u.some(s)&&d.push({heading:c,items:u});return d}function de({current:e,placeholder:t,renderLeading:r}){return(0,o.jsxs)(o.Fragment,{children:[r&&e?(0,o.jsx)("span",{"aria-hidden":"true",...a("workspace-switcher","leading"),children:r(e)}):null,(0,o.jsx)("span",{...a("workspace-switcher","current"),children:e?.label??t}),e?.description?(0,o.jsx)("span",{...a("workspace-switcher","description"),children:e.description}):null]})}function pe({item:e,selected:t,selectedLabel:r,renderLeading:n}){return(0,o.jsxs)(o.Fragment,{children:[n?(0,o.jsx)("span",{"aria-hidden":"true",...a("workspace-switcher","item-leading"),children:n(e)}):null,(0,o.jsx)("span",{...a("workspace-switcher","item-label"),children:e.label}),e.description?(0,o.jsx)("span",{...a("workspace-switcher","item-description"),children:e.description}):null,t?(0,o.jsx)(O.VisuallyHidden,{children:r}):null]})}var S=({items:e,value:t,defaultValue:r="",onValueChange:n,placeholder:s="Select",label:d,searchLabel:c="Search",searchPlaceholder:u,emptyMessage:h="No results",loadingMessage:E="Loading",loading:G=!1,selectedLabel:V="Current",renderLeading:C,actions:$,trigger:F,open:H,defaultOpen:D=!1,onOpenChange:J,onOpenChangeComplete:M,onEscapeKeyDown:X,onPointerDownOutside:_,onFocusOutside:K,onInteractOutside:U,onOpenAutoFocus:q,onCloseAutoFocus:z,...P})=>{let[k,B]=R(t,r,n),[w,Q]=R(H,D,J),[v,y]=f.useState(""),x=f.useRef(null),I=f.useRef(w);f.useEffect(()=>{w&&!I.current&&x.current?.focus(),I.current=w},[w]);let Y=e.find(l=>l.id===k),Z=ce(e,v),L=l=>{l||y(""),Q(l)},j=l=>{B(l),L(!1)};return(0,o.jsxs)(m.PopoverRoot,{open:w,onOpenChange:L,onOpenChangeComplete:M,modal:"none",children:[(0,o.jsx)(m.PopoverTrigger,{asChild:!0,"aria-label":d,...P,...a("workspace-switcher","root",P.className),children:F??(0,o.jsx)("button",{type:"button",children:(0,o.jsx)(de,{current:Y,placeholder:s,renderLeading:C})})}),(0,o.jsx)(m.PopoverPortal,{children:(0,o.jsxs)(m.PopoverContent,{onEscapeKeyDown:X,onPointerDownOutside:_,onFocusOutside:K,onInteractOutside:U,onOpenAutoFocus:q,onCloseAutoFocus:z,align:"start","aria-label":d??s,...a("workspace-switcher","content"),children:[(0,o.jsxs)(i.Command,{loading:G,search:v,onSearchChange:y,children:[(0,o.jsx)(i.CommandInput,{ref:x,"aria-label":c,placeholder:u,...a("workspace-switcher","search")}),(0,o.jsx)(i.CommandList,{"aria-label":d??s,...a("workspace-switcher","list"),children:Z.map(l=>(0,o.jsx)(i.CommandGroup,{heading:l.heading,...a("workspace-switcher","group"),children:l.items.map(p=>(0,o.jsx)(i.CommandItem,{value:p.id,keywords:p.description?[p.label,p.description]:[p.label],disabled:p.disabled,onSelect:()=>{j(p.id)},"data-selected":p.id===k?"":void 0,...a("workspace-switcher","item"),children:(0,o.jsx)(pe,{item:p,selected:p.id===k,selectedLabel:V,renderLeading:C})},p.id))},l.heading??""))}),(0,o.jsx)(i.CommandLoading,{...a("workspace-switcher","loading"),children:E}),(0,o.jsx)(i.CommandEmpty,{...a("workspace-switcher","empty"),children:h})]}),(0,o.jsx)(b,{part:a("workspace-switcher","footer"),children:$})]})})]})};S.displayName="WorkspaceSwitcher";0&&(module.exports={WorkspaceSwitcher});
2
+ "use strict";var j=Object.create;var g=Object.defineProperty;var ee=Object.getOwnPropertyDescriptor;var te=Object.getOwnPropertyNames;var oe=Object.getPrototypeOf,re=Object.prototype.hasOwnProperty;var ne=(e,t)=>{for(var r in t)g(e,r,{get:t[r],enumerable:!0})},W=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of te(t))!re.call(e,s)&&s!==r&&g(e,s,{get:()=>t[s],enumerable:!(n=ee(t,s))||n.enumerable});return e};var T=(e,t,r)=>(r=e!=null?j(oe(e)):{},W(t||!e||!e.__esModule?g(r,"default",{value:e,enumerable:!0}):r,e)),ae=e=>W(g({},"__esModule",{value:!0}),e);var pe={};ne(pe,{WorkspaceSwitcher:()=>R});module.exports=ae(pe);var f=T(require("react"),1),O=require("@skdx/react"),i=require("@skdx/react/primitives/command"),m=require("@skdx/react/primitives/popover");function se(...e){let t="";for(let r of e)r&&(t=t?`${t} ${r}`:r);return t}function a(e,t,r){let n=t==="root",s=n?`skdx-${e}`:`skdx-${e}__${t}`,d={className:se(s,r),"data-part":t};return n&&(d["data-skdx-component"]=e),d}var N=require("react/jsx-runtime"),S=({part:e,children:t})=>t?(0,N.jsx)("div",{...e,children:t}):null;S.displayName="Region";var A=T(require("react"),1);function b(e,t,r){let[n,s]=A.useState(t),d=e!==void 0;return[d?e:n,h=>{d||s(h),r?.(h)}]}var o=require("react/jsx-runtime");function ie(e,t){let r=t.toLowerCase(),n=new Map([[void 0,[]]]);for(let c of e){let u=n.get(c.group);u?u.push(c):n.set(c.group,[c])}let s=c=>r===""||c.id.toLowerCase().includes(r)||c.label.toLowerCase().includes(r)||(c.description?.toLowerCase().includes(r)??!1),d=[];for(let[c,u]of n)u.some(s)&&d.push({heading:c,items:u});return d}function ce({current:e,placeholder:t,renderLeading:r}){return(0,o.jsxs)(o.Fragment,{children:[r&&e?(0,o.jsx)("span",{"aria-hidden":"true",...a("workspace-switcher","leading"),children:r(e)}):null,(0,o.jsx)("span",{...a("workspace-switcher","current"),children:e?.label??t}),e?.description?(0,o.jsx)("span",{...a("workspace-switcher","description"),children:e.description}):null]})}function de({item:e,selected:t,selectedLabel:r,renderLeading:n}){return(0,o.jsxs)(o.Fragment,{children:[n?(0,o.jsx)("span",{"aria-hidden":"true",...a("workspace-switcher","item-leading"),children:n(e)}):null,(0,o.jsx)("span",{...a("workspace-switcher","item-label"),children:e.label}),e.description?(0,o.jsx)("span",{...a("workspace-switcher","item-description"),children:e.description}):null,t?(0,o.jsx)(O.VisuallyHidden,{children:r}):null]})}var R=({items:e,value:t,defaultValue:r="",onValueChange:n,placeholder:s="Select",label:d,searchLabel:c="Search",searchPlaceholder:u,emptyMessage:h="No results",loadingMessage:E="Loading",loading:G=!1,selectedLabel:V="Current",renderLeading:C,actions:$,trigger:H,open:D,defaultOpen:F=!1,onOpenChange:J,onOpenChangeComplete:M,onEscapeKeyDown:X,onPointerDownOutside:_,onFocusOutside:K,onInteractOutside:U,onCloseAutoFocus:q,...P})=>{let[k,z]=b(t,r,n),[w,B]=b(D,F,J),[v,y]=f.useState(""),x=f.useRef(null),I=f.useRef(w);f.useEffect(()=>{w&&!I.current&&x.current?.focus({preventScroll:!0}),I.current=w},[w]);let Q=e.find(l=>l.id===k),Y=ie(e,v),L=l=>{l||y(""),B(l)},Z=l=>{z(l),L(!1)};return(0,o.jsxs)(m.PopoverRoot,{open:w,onOpenChange:L,onOpenChangeComplete:M,modal:"none",children:[(0,o.jsx)(m.PopoverTrigger,{asChild:!0,"aria-label":d,...P,...a("workspace-switcher","root",P.className),children:H??(0,o.jsx)("button",{type:"button",children:(0,o.jsx)(ce,{current:Q,placeholder:s,renderLeading:C})})}),(0,o.jsx)(m.PopoverPortal,{children:(0,o.jsxs)(m.PopoverContent,{onEscapeKeyDown:X,onPointerDownOutside:_,onFocusOutside:K,onInteractOutside:U,onCloseAutoFocus:q,align:"start","aria-label":d??s,...a("workspace-switcher","content"),children:[(0,o.jsxs)(i.Command,{loading:G,search:v,onSearchChange:y,children:[(0,o.jsx)(i.CommandInput,{ref:x,"aria-label":c,placeholder:u,...a("workspace-switcher","search")}),(0,o.jsx)(i.CommandList,{"aria-label":d??s,...a("workspace-switcher","list"),children:Y.map(l=>(0,o.jsx)(i.CommandGroup,{heading:l.heading,...a("workspace-switcher","group"),children:l.items.map(p=>(0,o.jsx)(i.CommandItem,{value:p.id,keywords:p.description?[p.label,p.description]:[p.label],disabled:p.disabled,onSelect:()=>{Z(p.id)},"data-selected":p.id===k?"":void 0,...a("workspace-switcher","item"),children:(0,o.jsx)(de,{item:p,selected:p.id===k,selectedLabel:V,renderLeading:C})},p.id))},l.heading??""))}),(0,o.jsx)(i.CommandLoading,{...a("workspace-switcher","loading"),children:E}),(0,o.jsx)(i.CommandEmpty,{...a("workspace-switcher","empty"),children:h})]}),(0,o.jsx)(S,{part:a("workspace-switcher","footer"),children:$})]})})]})};R.displayName="WorkspaceSwitcher";0&&(module.exports={WorkspaceSwitcher});
@@ -20,6 +20,6 @@ import type { WorkspaceSwitcherProps } from './types.cjs';
20
20
  * ```
21
21
  */
22
22
  export declare const WorkspaceSwitcher: {
23
- ({ items, value: valueProp, defaultValue, onValueChange, placeholder, label, searchLabel, searchPlaceholder, emptyMessage, loadingMessage, loading, selectedLabel, renderLeading, actions, trigger, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, onEscapeKeyDown, onPointerDownOutside, onFocusOutside, onInteractOutside, onOpenAutoFocus, onCloseAutoFocus, ...props }: WorkspaceSwitcherProps): React.ReactNode;
23
+ ({ items, value: valueProp, defaultValue, onValueChange, placeholder, label, searchLabel, searchPlaceholder, emptyMessage, loadingMessage, loading, selectedLabel, renderLeading, actions, trigger, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, onEscapeKeyDown, onPointerDownOutside, onFocusOutside, onInteractOutside, onCloseAutoFocus, ...props }: WorkspaceSwitcherProps): React.ReactNode;
24
24
  displayName: string;
25
25
  };
@@ -20,6 +20,6 @@ import type { WorkspaceSwitcherProps } from './types.js';
20
20
  * ```
21
21
  */
22
22
  export declare const WorkspaceSwitcher: {
23
- ({ items, value: valueProp, defaultValue, onValueChange, placeholder, label, searchLabel, searchPlaceholder, emptyMessage, loadingMessage, loading, selectedLabel, renderLeading, actions, trigger, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, onEscapeKeyDown, onPointerDownOutside, onFocusOutside, onInteractOutside, onOpenAutoFocus, onCloseAutoFocus, ...props }: WorkspaceSwitcherProps): React.ReactNode;
23
+ ({ items, value: valueProp, defaultValue, onValueChange, placeholder, label, searchLabel, searchPlaceholder, emptyMessage, loadingMessage, loading, selectedLabel, renderLeading, actions, trigger, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, onEscapeKeyDown, onPointerDownOutside, onFocusOutside, onInteractOutside, onCloseAutoFocus, ...props }: WorkspaceSwitcherProps): React.ReactNode;
24
24
  displayName: string;
25
25
  };
@@ -1,2 +1,2 @@
1
1
  'use client';
2
- import*as u from"react";import{VisuallyHidden as Y}from"@skdx/react";import{Command as Z,CommandEmpty as j,CommandGroup as ee,CommandInput as te,CommandItem as oe,CommandList as re,CommandLoading as ne}from"@skdx/react/primitives/command";import{PopoverContent as ae,PopoverPortal as se,PopoverRoot as ie,PopoverTrigger as ce}from"@skdx/react/primitives/popover";function B(...e){let t="";for(let o of e)o&&(t=t?`${t} ${o}`:o);return t}function n(e,t,o){let a=t==="root",p=a?`skdx-${e}`:`skdx-${e}__${t}`,i={className:B(p,o),"data-part":t};return a&&(i["data-skdx-component"]=e),i}import{jsx as Q}from"react/jsx-runtime";var g=({part:e,children:t})=>t?Q("div",{...e,children:t}):null;g.displayName="Region";import*as x from"react";function k(e,t,o){let[a,p]=x.useState(t),i=e!==void 0;return[i?e:a,w=>{i||p(w),o?.(w)}]}import{Fragment as L,jsx as r,jsxs as f}from"react/jsx-runtime";function de(e,t){let o=t.toLowerCase(),a=new Map([[void 0,[]]]);for(let s of e){let l=a.get(s.group);l?l.push(s):a.set(s.group,[s])}let p=s=>o===""||s.id.toLowerCase().includes(o)||s.label.toLowerCase().includes(o)||(s.description?.toLowerCase().includes(o)??!1),i=[];for(let[s,l]of a)l.some(p)&&i.push({heading:s,items:l});return i}function pe({current:e,placeholder:t,renderLeading:o}){return f(L,{children:[o&&e?r("span",{"aria-hidden":"true",...n("workspace-switcher","leading"),children:o(e)}):null,r("span",{...n("workspace-switcher","current"),children:e?.label??t}),e?.description?r("span",{...n("workspace-switcher","description"),children:e.description}):null]})}function le({item:e,selected:t,selectedLabel:o,renderLeading:a}){return f(L,{children:[a?r("span",{"aria-hidden":"true",...n("workspace-switcher","item-leading"),children:a(e)}):null,r("span",{...n("workspace-switcher","item-label"),children:e.label}),e.description?r("span",{...n("workspace-switcher","item-description"),children:e.description}):null,t?r(Y,{children:o}):null]})}var I=({items:e,value:t,defaultValue:o="",onValueChange:a,placeholder:p="Select",label:i,searchLabel:s="Search",searchPlaceholder:l,emptyMessage:w="No results",loadingMessage:W="Loading",loading:T=!1,selectedLabel:N="Current",renderLeading:b,actions:A,trigger:O,open:E,defaultOpen:G=!1,onOpenChange:V,onOpenChangeComplete:$,onEscapeKeyDown:F,onPointerDownOutside:H,onFocusOutside:D,onInteractOutside:J,onOpenAutoFocus:M,onCloseAutoFocus:X,...R})=>{let[h,_]=k(t,o,a),[m,K]=k(E,G,V),[S,C]=u.useState(""),P=u.useRef(null),v=u.useRef(m);u.useEffect(()=>{m&&!v.current&&P.current?.focus(),v.current=m},[m]);let U=e.find(d=>d.id===h),q=de(e,S),y=d=>{d||C(""),K(d)},z=d=>{_(d),y(!1)};return f(ie,{open:m,onOpenChange:y,onOpenChangeComplete:$,modal:"none",children:[r(ce,{asChild:!0,"aria-label":i,...R,...n("workspace-switcher","root",R.className),children:O??r("button",{type:"button",children:r(pe,{current:U,placeholder:p,renderLeading:b})})}),r(se,{children:f(ae,{onEscapeKeyDown:F,onPointerDownOutside:H,onFocusOutside:D,onInteractOutside:J,onOpenAutoFocus:M,onCloseAutoFocus:X,align:"start","aria-label":i??p,...n("workspace-switcher","content"),children:[f(Z,{loading:T,search:S,onSearchChange:C,children:[r(te,{ref:P,"aria-label":s,placeholder:l,...n("workspace-switcher","search")}),r(re,{"aria-label":i??p,...n("workspace-switcher","list"),children:q.map(d=>r(ee,{heading:d.heading,...n("workspace-switcher","group"),children:d.items.map(c=>r(oe,{value:c.id,keywords:c.description?[c.label,c.description]:[c.label],disabled:c.disabled,onSelect:()=>{z(c.id)},"data-selected":c.id===h?"":void 0,...n("workspace-switcher","item"),children:r(le,{item:c,selected:c.id===h,selectedLabel:N,renderLeading:b})},c.id))},d.heading??""))}),r(ne,{...n("workspace-switcher","loading"),children:W}),r(j,{...n("workspace-switcher","empty"),children:w})]}),r(g,{part:n("workspace-switcher","footer"),children:A})]})})]})};I.displayName="WorkspaceSwitcher";export{I as WorkspaceSwitcher};
2
+ import*as u from"react";import{VisuallyHidden as Q}from"@skdx/react";import{Command as Y,CommandEmpty as Z,CommandGroup as j,CommandInput as ee,CommandItem as te,CommandList as oe,CommandLoading as re}from"@skdx/react/primitives/command";import{PopoverContent as ne,PopoverPortal as ae,PopoverRoot as se,PopoverTrigger as ie}from"@skdx/react/primitives/popover";function z(...e){let t="";for(let o of e)o&&(t=t?`${t} ${o}`:o);return t}function n(e,t,o){let a=t==="root",p=a?`skdx-${e}`:`skdx-${e}__${t}`,i={className:z(p,o),"data-part":t};return a&&(i["data-skdx-component"]=e),i}import{jsx as B}from"react/jsx-runtime";var g=({part:e,children:t})=>t?B("div",{...e,children:t}):null;g.displayName="Region";import*as x from"react";function k(e,t,o){let[a,p]=x.useState(t),i=e!==void 0;return[i?e:a,w=>{i||p(w),o?.(w)}]}import{Fragment as L,jsx as r,jsxs as f}from"react/jsx-runtime";function ce(e,t){let o=t.toLowerCase(),a=new Map([[void 0,[]]]);for(let s of e){let l=a.get(s.group);l?l.push(s):a.set(s.group,[s])}let p=s=>o===""||s.id.toLowerCase().includes(o)||s.label.toLowerCase().includes(o)||(s.description?.toLowerCase().includes(o)??!1),i=[];for(let[s,l]of a)l.some(p)&&i.push({heading:s,items:l});return i}function de({current:e,placeholder:t,renderLeading:o}){return f(L,{children:[o&&e?r("span",{"aria-hidden":"true",...n("workspace-switcher","leading"),children:o(e)}):null,r("span",{...n("workspace-switcher","current"),children:e?.label??t}),e?.description?r("span",{...n("workspace-switcher","description"),children:e.description}):null]})}function pe({item:e,selected:t,selectedLabel:o,renderLeading:a}){return f(L,{children:[a?r("span",{"aria-hidden":"true",...n("workspace-switcher","item-leading"),children:a(e)}):null,r("span",{...n("workspace-switcher","item-label"),children:e.label}),e.description?r("span",{...n("workspace-switcher","item-description"),children:e.description}):null,t?r(Q,{children:o}):null]})}var I=({items:e,value:t,defaultValue:o="",onValueChange:a,placeholder:p="Select",label:i,searchLabel:s="Search",searchPlaceholder:l,emptyMessage:w="No results",loadingMessage:W="Loading",loading:T=!1,selectedLabel:N="Current",renderLeading:S,actions:A,trigger:O,open:E,defaultOpen:G=!1,onOpenChange:V,onOpenChangeComplete:$,onEscapeKeyDown:H,onPointerDownOutside:D,onFocusOutside:F,onInteractOutside:J,onCloseAutoFocus:M,...b})=>{let[h,X]=k(t,o,a),[m,_]=k(E,G,V),[R,C]=u.useState(""),P=u.useRef(null),v=u.useRef(m);u.useEffect(()=>{m&&!v.current&&P.current?.focus({preventScroll:!0}),v.current=m},[m]);let K=e.find(d=>d.id===h),U=ce(e,R),y=d=>{d||C(""),_(d)},q=d=>{X(d),y(!1)};return f(se,{open:m,onOpenChange:y,onOpenChangeComplete:$,modal:"none",children:[r(ie,{asChild:!0,"aria-label":i,...b,...n("workspace-switcher","root",b.className),children:O??r("button",{type:"button",children:r(de,{current:K,placeholder:p,renderLeading:S})})}),r(ae,{children:f(ne,{onEscapeKeyDown:H,onPointerDownOutside:D,onFocusOutside:F,onInteractOutside:J,onCloseAutoFocus:M,align:"start","aria-label":i??p,...n("workspace-switcher","content"),children:[f(Y,{loading:T,search:R,onSearchChange:C,children:[r(ee,{ref:P,"aria-label":s,placeholder:l,...n("workspace-switcher","search")}),r(oe,{"aria-label":i??p,...n("workspace-switcher","list"),children:U.map(d=>r(j,{heading:d.heading,...n("workspace-switcher","group"),children:d.items.map(c=>r(te,{value:c.id,keywords:c.description?[c.label,c.description]:[c.label],disabled:c.disabled,onSelect:()=>{q(c.id)},"data-selected":c.id===h?"":void 0,...n("workspace-switcher","item"),children:r(pe,{item:c,selected:c.id===h,selectedLabel:N,renderLeading:S})},c.id))},d.heading??""))}),r(re,{...n("workspace-switcher","loading"),children:W}),r(Z,{...n("workspace-switcher","empty"),children:w})]}),r(g,{part:n("workspace-switcher","footer"),children:A})]})})]})};I.displayName="WorkspaceSwitcher";export{I as WorkspaceSwitcher};
@@ -137,11 +137,6 @@ export interface WorkspaceSwitcherProps extends Omit<React.ComponentPropsWithRef
137
137
  * @default undefined — no-op if omitted.
138
138
  */
139
139
  onInteractOutside?: ContentProps['onInteractOutside'];
140
- /**
141
- * Fires before focus moves into the content on open; `preventDefault()` leaves focus where it is.
142
- * @default undefined — no-op if omitted.
143
- */
144
- onOpenAutoFocus?: ContentProps['onOpenAutoFocus'];
145
140
  /**
146
141
  * Fires before focus returns to the trigger on close; `preventDefault()` suppresses that return.
147
142
  * @default undefined — no-op if omitted.
@@ -137,11 +137,6 @@ export interface WorkspaceSwitcherProps extends Omit<React.ComponentPropsWithRef
137
137
  * @default undefined — no-op if omitted.
138
138
  */
139
139
  onInteractOutside?: ContentProps['onInteractOutside'];
140
- /**
141
- * Fires before focus moves into the content on open; `preventDefault()` leaves focus where it is.
142
- * @default undefined — no-op if omitted.
143
- */
144
- onOpenAutoFocus?: ContentProps['onOpenAutoFocus'];
145
140
  /**
146
141
  * Fires before focus returns to the trigger on close; `preventDefault()` suppresses that return.
147
142
  * @default undefined — no-op if omitted.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skdx/react-blocks",
3
- "version": "0.39.0",
3
+ "version": "0.40.0",
4
4
  "description": "React blocks for the SkandaDX design system — page-level compositions of @skdx/react styled by @skdx/skins",
5
5
  "license": "MIT",
6
6
  "publishConfig": {
@@ -255,7 +255,7 @@
255
255
  "peerDependencies": {
256
256
  "react": "^19.0.0",
257
257
  "react-dom": "^19.0.0",
258
- "@skdx/react": "^0.39.0"
258
+ "@skdx/react": "^0.40.0"
259
259
  },
260
260
  "devDependencies": {
261
261
  "@testing-library/jest-dom": "^6.9.1",
@@ -273,8 +273,8 @@
273
273
  "tsup": "^8.5.1",
274
274
  "typescript": "^6.0.3",
275
275
  "vitest": "^4.1.10",
276
- "@skdx/react": "0.39.0",
277
- "@skdx/shared": "0.39.0"
276
+ "@skdx/shared": "0.40.0",
277
+ "@skdx/react": "0.40.0"
278
278
  },
279
279
  "scripts": {
280
280
  "lint": "eslint . --cache --cache-location node_modules/.cache/eslint/",