@skdx/react-blocks 0.34.0 → 0.36.0

package/dist/form-section/FormSection.cjs

@@ -0,0 +1,2 @@
+'use client';
+"use strict";var g=Object.create;var d=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,v=Object.prototype.hasOwnProperty;var y=(e,t)=>{for(var o in t)d(e,o,{get:t[o],enumerable:!0})},x=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of k(t))!v.call(e,r)&&r!==o&&d(e,r,{get:()=>t[r],enumerable:!(i=b(t,r))||i.enumerable});return e};var P=(e,t,o)=>(o=e!=null?g(S(e)):{},x(t||!e||!e.__esModule?d(o,"default",{value:e,enumerable:!0}):o,e)),F=e=>x(d({},"__esModule",{value:!0}),e);var $={};y($,{FormSection:()=>f});module.exports=F($);var m=P(require("react"),1),c=require("@skdx/react");function R(...e){let t="";for(let o of e)o&&(t=t?`${t} ${o}`:o);return t}function s(e,t,o){let i=t==="root",r=i?`skdx-${e}`:`skdx-${e}__${t}`,a={className:R(r,o),"data-part":t};return i&&(a["data-skdx-component"]=e),a}var n=require("react/jsx-runtime"),f=({title:e,description:t,headingLevel:o=2,actions:i,variant:r,children:a,...u})=>{let l=m.useId(),p=m.useId();return(0,n.jsxs)("section",{"data-variant":r,"aria-labelledby":l,"aria-describedby":t?p:void 0,...u,...s("form-section","root",u.className),children:[(0,n.jsxs)("div",{...s("form-section","header"),children:[(0,n.jsx)(c.Heading,{as:`h${o}`,id:l,...s("form-section","title"),children:e}),t?(0,n.jsx)(c.Text,{as:"p",tone:"muted",id:p,...s("form-section","description"),children:t}):null]}),(0,n.jsx)("div",{...s("form-section","content"),children:a}),i?(0,n.jsx)("div",{...s("form-section","footer"),children:i}):null]})};f.displayName="FormSection";0&&(module.exports={FormSection});

package/dist/form-section/FormSection.d.cts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import type { FormSectionProps } from './types.cjs';
+/**
+ * Titled group inside a larger form: a heading, supporting text, the
+ * group's fields and a footer for the group's own actions, composing
+ * Heading and Text around consumer-supplied fields.
+ *
+ * @example
+ * ```tsx
+ * <FormSection
+ *   title="Billing address"
+ *   description="Used for invoices and receipts."
+ *   actions={<Button type="submit">Save</Button>}
+ * >
+ *   <TextField label="Street" />
+ * </FormSection>
+ * ```
+ */
+export declare const FormSection: {
+    ({ title, description, headingLevel, actions, variant, children, ...props }: FormSectionProps): React.ReactNode;
+    displayName: string;
+};

package/dist/form-section/FormSection.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import type { FormSectionProps } from './types.js';
+/**
+ * Titled group inside a larger form: a heading, supporting text, the
+ * group's fields and a footer for the group's own actions, composing
+ * Heading and Text around consumer-supplied fields.
+ *
+ * @example
+ * ```tsx
+ * <FormSection
+ *   title="Billing address"
+ *   description="Used for invoices and receipts."
+ *   actions={<Button type="submit">Save</Button>}
+ * >
+ *   <TextField label="Street" />
+ * </FormSection>
+ * ```
+ */
+export declare const FormSection: {
+    ({ title, description, headingLevel, actions, variant, children, ...props }: FormSectionProps): React.ReactNode;
+    displayName: string;
+};

package/dist/form-section/FormSection.js

@@ -0,0 +1,2 @@
+'use client';
+import*as d from"react";import{Heading as x,Text as g}from"@skdx/react";function p(...e){let t="";for(let o of e)o&&(t=t?`${t} ${o}`:o);return t}function r(e,t,o){let i=t==="root",a=i?`skdx-${e}`:`skdx-${e}__${t}`,n={className:p(a,o),"data-part":t};return i&&(n["data-skdx-component"]=e),n}import{jsx as s,jsxs as u}from"react/jsx-runtime";var l=({title:e,description:t,headingLevel:o=2,actions:i,variant:a,children:n,...c})=>{let m=d.useId(),f=d.useId();return u("section",{"data-variant":a,"aria-labelledby":m,"aria-describedby":t?f:void 0,...c,...r("form-section","root",c.className),children:[u("div",{...r("form-section","header"),children:[s(x,{as:`h${o}`,id:m,...r("form-section","title"),children:e}),t?s(g,{as:"p",tone:"muted",id:f,...r("form-section","description"),children:t}):null]}),s("div",{...r("form-section","content"),children:n}),i?s("div",{...r("form-section","footer"),children:i}):null]})};l.displayName="FormSection";export{l as FormSection};

package/dist/form-section/index.d.cts

@@ -0,0 +1,2 @@
+export { FormSection } from './FormSection.cjs';
+export type { FormSectionProps } from './types.cjs';

package/dist/form-section/index.d.ts

@@ -0,0 +1,2 @@
+export { FormSection } from './FormSection.js';
+export type { FormSectionProps } from './types.js';

package/dist/form-section/types.d.cts

@@ -0,0 +1,27 @@
+import type * as React from 'react';
+/** Props for the {@link FormSection} block. */
+export interface FormSectionProps extends React.ComponentPropsWithRef<'section'> {
+    /** Heading text naming the group, rendered into a derived Heading that names the section. */
+    title: string;
+    /**
+     * Supporting copy rendered below the title, explaining the group's fields.
+     * @default undefined — no description region renders and aria-describedby is omitted.
+     */
+    description?: string | undefined;
+    /**
+     * Outline level of the derived title heading, from `1` down to `6` inside a larger form outline.
+     * @default 2
+     */
+    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+    /**
+     * Save, cancel or other controls rendered in a footer below the group's fields.
+     * @default undefined — no footer region renders.
+     */
+    actions?: React.ReactNode | undefined;
+    /**
+     * Layout rung mirrored to `data-variant`; `bordered` draws a bounded panel and `split`
+     * places the header beside the content on wide viewports.
+     * @default undefined — plain, stacked layout.
+     */
+    variant?: 'bordered' | 'split' | (string & {}) | undefined;
+}

package/dist/form-section/types.d.ts

@@ -0,0 +1,27 @@
+import type * as React from 'react';
+/** Props for the {@link FormSection} block. */
+export interface FormSectionProps extends React.ComponentPropsWithRef<'section'> {
+    /** Heading text naming the group, rendered into a derived Heading that names the section. */
+    title: string;
+    /**
+     * Supporting copy rendered below the title, explaining the group's fields.
+     * @default undefined — no description region renders and aria-describedby is omitted.
+     */
+    description?: string | undefined;
+    /**
+     * Outline level of the derived title heading, from `1` down to `6` inside a larger form outline.
+     * @default 2
+     */
+    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+    /**
+     * Save, cancel or other controls rendered in a footer below the group's fields.
+     * @default undefined — no footer region renders.
+     */
+    actions?: React.ReactNode | undefined;
+    /**
+     * Layout rung mirrored to `data-variant`; `bordered` draws a bounded panel and `split`
+     * places the header beside the content on wide viewports.
+     * @default undefined — plain, stacked layout.
+     */
+    variant?: 'bordered' | 'split' | (string & {}) | undefined;
+}

package/dist/index.cjs

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var n=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var s=(e,a)=>{for(var r in a)n(e,r,{get:a[r],enumerable:!0})},b=(e,a,r,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let o of P(a))!d.call(e,o)&&o!==r&&n(e,o,{get:()=>a[o],enumerable:!(i=y(a,o))||i.enumerable});return e};var m=e=>b(n({},"__esModule",{value:!0}),e);var D={};s(D,{DashboardLayout:()=>p.DashboardLayout,PageContainer:()=>g.PageContainer,SignInPage:()=>t.SignInPage,defaultProviderLabel:()=>t.defaultProviderLabel});module.exports=m(D);var p=require("./dashboard-layout/DashboardLayout.cjs"),g=require("./page-container/PageContainer.cjs"),t=require("./sign-in-page/SignInPage.cjs");0&&(module.exports={DashboardLayout,PageContainer,SignInPage,defaultProviderLabel});
+"use strict";var a=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var L=Object.prototype.hasOwnProperty;var N=(t,e)=>{for(var r in e)a(t,r,{get:e[r],enumerable:!0})},B=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of U(e))!L.call(t,o)&&o!==r&&a(t,o,{get:()=>e[o],enumerable:!(i=v(e,o))||i.enumerable});return t};var M=t=>B(a({},"__esModule",{value:!0}),t);var O={};N(O,{ChatComposer:()=>P.ChatComposer,ChatMessage:()=>g.ChatMessage,Comment:()=>C.Comment,CommentThread:()=>f.CommentThread,ConfirmDialog:()=>d.ConfirmDialog,ConversationList:()=>x.ConversationList,DashboardLayout:()=>s.DashboardLayout,EmptyState:()=>m.EmptyState,FilterBar:()=>c.FilterBar,ForgotPasswordPage:()=>F.ForgotPasswordPage,FormSection:()=>h.FormSection,NotificationCenter:()=>S.NotificationCenter,OnboardingChecklist:()=>l.OnboardingChecklist,PageContainer:()=>n.PageContainer,ResetPasswordPage:()=>k.ResetPasswordPage,SignInPage:()=>p.SignInPage,SignUpPage:()=>w.SignUpPage,StatCard:()=>y.StatCard,UsageCard:()=>D.UsageCard,UserMenu:()=>b.UserMenu,VerificationPage:()=>u.VerificationPage,WorkspaceSwitcher:()=>I.WorkspaceSwitcher,defaultProviderLabel:()=>p.defaultProviderLabel});module.exports=M(O);var s=require("./dashboard-layout/DashboardLayout.cjs"),n=require("./page-container/PageContainer.cjs"),p=require("./sign-in-page/SignInPage.cjs"),m=require("./empty-state/EmptyState.cjs"),y=require("./stat-card/StatCard.cjs"),P=require("./chat-composer/ChatComposer.cjs"),g=require("./chat-message/ChatMessage.cjs"),C=require("./comment/Comment.cjs"),f=require("./comment-thread/CommentThread.cjs"),d=require("./confirm-dialog/ConfirmDialog.cjs"),x=require("./conversation-list/ConversationList.cjs"),c=require("./filter-bar/FilterBar.cjs"),h=require("./form-section/FormSection.cjs"),S=require("./notification-center/NotificationCenter.cjs"),l=require("./onboarding-checklist/OnboardingChecklist.cjs"),D=require("./usage-card/UsageCard.cjs"),b=require("./user-menu/UserMenu.cjs"),I=require("./workspace-switcher/WorkspaceSwitcher.cjs"),w=require("./sign-up-page/SignUpPage.cjs"),F=require("./forgot-password-page/ForgotPasswordPage.cjs"),k=require("./reset-password-page/ResetPasswordPage.cjs"),u=require("./verification-page/VerificationPage.cjs");0&&(module.exports={ChatComposer,ChatMessage,Comment,CommentThread,ConfirmDialog,ConversationList,DashboardLayout,EmptyState,FilterBar,ForgotPasswordPage,FormSection,NotificationCenter,OnboardingChecklist,PageContainer,ResetPasswordPage,SignInPage,SignUpPage,StatCard,UsageCard,UserMenu,VerificationPage,WorkspaceSwitcher,defaultProviderLabel});

package/dist/index.d.cts

@@ -1,3 +1,22 @@
 export { DashboardLayout, type DashboardLayoutProps, type DashboardNavigationItem, type DashboardNavigationKind, } from './dashboard-layout/index.cjs';
 export { PageContainer, type PageContainerProps, type PageContainerBreadcrumb, } from './page-container/index.cjs';
 export { SignInPage, defaultProviderLabel, type SignInPageProps, type SignInProvider, type SignInDetail, } from './sign-in-page/index.cjs';
+export { EmptyState, type EmptyStateProps } from './empty-state/index.cjs';
+export { StatCard, type StatCardProps } from './stat-card/index.cjs';
+export { ChatComposer, type ChatComposerProps, type ChatComposerSendDetail, type ChatComposerSubmitKey, } from './chat-composer/index.cjs';
+export { ChatMessage, type ChatMessageProps } from './chat-message/index.cjs';
+export { Comment, type CommentProps } from './comment/index.cjs';
+export { CommentThread, type CommentThreadProps } from './comment-thread/index.cjs';
+export { ConfirmDialog, type ConfirmDialogProps } from './confirm-dialog/index.cjs';
+export { ConversationList, type ConversationListItem, type ConversationListProps, } from './conversation-list/index.cjs';
+export { FilterBar, type FilterBarFilter, type FilterBarProps } from './filter-bar/index.cjs';
+export { FormSection, type FormSectionProps } from './form-section/index.cjs';
+export { NotificationCenter, type NotificationCenterItem, type NotificationCenterProps, } from './notification-center/index.cjs';
+export { OnboardingChecklist, type OnboardingChecklistItem, type OnboardingChecklistItemState, type OnboardingChecklistProps, } from './onboarding-checklist/index.cjs';
+export { UsageCard, type UsageCardProps } from './usage-card/index.cjs';
+export { UserMenu, type UserMenuProps } from './user-menu/index.cjs';
+export { WorkspaceSwitcher, type WorkspaceSwitcherItem, type WorkspaceSwitcherProps, } from './workspace-switcher/index.cjs';
+export { SignUpPage, type SignUpPageProps, type SignUpDetail } from './sign-up-page/index.cjs';
+export { ForgotPasswordPage, type ForgotPasswordPageProps, type ForgotPasswordDetail, } from './forgot-password-page/index.cjs';
+export { ResetPasswordPage, type ResetPasswordPageProps, type ResetPasswordDetail, } from './reset-password-page/index.cjs';
+export { VerificationPage, type VerificationPageProps, type VerificationDetail, } from './verification-page/index.cjs';

package/dist/index.d.ts

@@ -1,3 +1,22 @@
 export { DashboardLayout, type DashboardLayoutProps, type DashboardNavigationItem, type DashboardNavigationKind, } from './dashboard-layout/index.js';
 export { PageContainer, type PageContainerProps, type PageContainerBreadcrumb, } from './page-container/index.js';
 export { SignInPage, defaultProviderLabel, type SignInPageProps, type SignInProvider, type SignInDetail, } from './sign-in-page/index.js';
+export { EmptyState, type EmptyStateProps } from './empty-state/index.js';
+export { StatCard, type StatCardProps } from './stat-card/index.js';
+export { ChatComposer, type ChatComposerProps, type ChatComposerSendDetail, type ChatComposerSubmitKey, } from './chat-composer/index.js';
+export { ChatMessage, type ChatMessageProps } from './chat-message/index.js';
+export { Comment, type CommentProps } from './comment/index.js';
+export { CommentThread, type CommentThreadProps } from './comment-thread/index.js';
+export { ConfirmDialog, type ConfirmDialogProps } from './confirm-dialog/index.js';
+export { ConversationList, type ConversationListItem, type ConversationListProps, } from './conversation-list/index.js';
+export { FilterBar, type FilterBarFilter, type FilterBarProps } from './filter-bar/index.js';
+export { FormSection, type FormSectionProps } from './form-section/index.js';
+export { NotificationCenter, type NotificationCenterItem, type NotificationCenterProps, } from './notification-center/index.js';
+export { OnboardingChecklist, type OnboardingChecklistItem, type OnboardingChecklistItemState, type OnboardingChecklistProps, } from './onboarding-checklist/index.js';
+export { UsageCard, type UsageCardProps } from './usage-card/index.js';
+export { UserMenu, type UserMenuProps } from './user-menu/index.js';
+export { WorkspaceSwitcher, type WorkspaceSwitcherItem, type WorkspaceSwitcherProps, } from './workspace-switcher/index.js';
+export { SignUpPage, type SignUpPageProps, type SignUpDetail } from './sign-up-page/index.js';
+export { ForgotPasswordPage, type ForgotPasswordPageProps, type ForgotPasswordDetail, } from './forgot-password-page/index.js';
+export { ResetPasswordPage, type ResetPasswordPageProps, type ResetPasswordDetail, } from './reset-password-page/index.js';
+export { VerificationPage, type VerificationPageProps, type VerificationDetail, } from './verification-page/index.js';

package/dist/index.js

@@ -1,2 +1,2 @@
 'use client';
-import{DashboardLayout as o}from"./dashboard-layout/DashboardLayout.js";import{PageContainer as t}from"./page-container/PageContainer.js";import{SignInPage as i,defaultProviderLabel as p}from"./sign-in-page/SignInPage.js";export{o as DashboardLayout,t as PageContainer,i as SignInPage,p as defaultProviderLabel};
+import{DashboardLayout as o}from"./dashboard-layout/DashboardLayout.js";import{PageContainer as p}from"./page-container/PageContainer.js";import{SignInPage as i,defaultProviderLabel as s}from"./sign-in-page/SignInPage.js";import{EmptyState as m}from"./empty-state/EmptyState.js";import{StatCard as P}from"./stat-card/StatCard.js";import{ChatComposer as C}from"./chat-composer/ChatComposer.js";import{ChatMessage as d}from"./chat-message/ChatMessage.js";import{Comment as c}from"./comment/Comment.js";import{CommentThread as S}from"./comment-thread/CommentThread.js";import{ConfirmDialog as D}from"./confirm-dialog/ConfirmDialog.js";import{ConversationList as I}from"./conversation-list/ConversationList.js";import{FilterBar as F}from"./filter-bar/FilterBar.js";import{FormSection as u}from"./form-section/FormSection.js";import{NotificationCenter as U}from"./notification-center/NotificationCenter.js";import{OnboardingChecklist as N}from"./onboarding-checklist/OnboardingChecklist.js";import{UsageCard as M}from"./usage-card/UsageCard.js";import{UserMenu as R}from"./user-menu/UserMenu.js";import{WorkspaceSwitcher as W}from"./workspace-switcher/WorkspaceSwitcher.js";import{SignUpPage as K}from"./sign-up-page/SignUpPage.js";import{ForgotPasswordPage as j}from"./forgot-password-page/ForgotPasswordPage.js";import{ResetPasswordPage as z}from"./reset-password-page/ResetPasswordPage.js";import{VerificationPage as G}from"./verification-page/VerificationPage.js";export{C as ChatComposer,d as ChatMessage,c as Comment,S as CommentThread,D as ConfirmDialog,I as ConversationList,o as DashboardLayout,m as EmptyState,F as FilterBar,j as ForgotPasswordPage,u as FormSection,U as NotificationCenter,N as OnboardingChecklist,p as PageContainer,z as ResetPasswordPage,i as SignInPage,K as SignUpPage,P as StatCard,M as UsageCard,R as UserMenu,G as VerificationPage,W as WorkspaceSwitcher,s as defaultProviderLabel};

package/dist/internal/AuthPanel.d.cts

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import type { SkdxPartAttributes } from './part.cjs';
+/**
+ * The part bags an {@link AuthPanel} spreads onto the elements it renders. Each page builds
+ * them itself, since the parity tooling reads the part helper's family and part names as string literals.
+ *
+ * @internal
+ */
+export interface AuthPanelParts {
+    /** Root `<section>` bag, already merged with the consumer's `className` by the caller. */
+    root: SkdxPartAttributes;
+    /** Bag for the card the heading, error and content sit in. */
+    panel: SkdxPartAttributes;
+    /** Bag for the derived `<h1>` that names the section. */
+    title: SkdxPartAttributes;
+    /** Bag for the derived error Alert. */
+    error: SkdxPartAttributes;
+    /**
+     * Bag for the footer region; omit it on a page whose contract declares no footer part.
+     * @default undefined — the footer region never renders.
+     */
+    footer?: SkdxPartAttributes | undefined;
+}
+/**
+ * Props for {@link AuthPanel}, the shell shared by the authentication blocks.
+ *
+ * @internal
+ */
+export interface AuthPanelProps extends React.ComponentPropsWithRef<'section'> {
+    /** Part bags the page computed for its own family. */
+    parts: AuthPanelParts;
+    /** Heading text, rendered into the derived `<h1>` that names the section. */
+    title: string;
+    /**
+     * Message rendered into the derived error Alert above the content.
+     * @default undefined — no error region renders.
+     */
+    error?: string | undefined;
+    /**
+     * Navigation rendered below the content, inside the footer region.
+     * @default undefined — no footer region renders.
+     */
+    footer?: React.ReactNode | undefined;
+}
+/**
+ * Shell of every authentication block: a `<section>` named by its own heading, wrapping a
+ * panel that holds the heading, an optional error Alert, the page's content and a footer.
+ *
+ * @internal
+ */
+export declare const AuthPanel: {
+    ({ parts, title, error, footer, children, ...rest }: AuthPanelProps): React.ReactNode;
+    displayName: string;
+};

package/dist/internal/AuthPanel.d.ts

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import type { SkdxPartAttributes } from './part.js';
+/**
+ * The part bags an {@link AuthPanel} spreads onto the elements it renders. Each page builds
+ * them itself, since the parity tooling reads the part helper's family and part names as string literals.
+ *
+ * @internal
+ */
+export interface AuthPanelParts {
+    /** Root `<section>` bag, already merged with the consumer's `className` by the caller. */
+    root: SkdxPartAttributes;
+    /** Bag for the card the heading, error and content sit in. */
+    panel: SkdxPartAttributes;
+    /** Bag for the derived `<h1>` that names the section. */
+    title: SkdxPartAttributes;
+    /** Bag for the derived error Alert. */
+    error: SkdxPartAttributes;
+    /**
+     * Bag for the footer region; omit it on a page whose contract declares no footer part.
+     * @default undefined — the footer region never renders.
+     */
+    footer?: SkdxPartAttributes | undefined;
+}
+/**
+ * Props for {@link AuthPanel}, the shell shared by the authentication blocks.
+ *
+ * @internal
+ */
+export interface AuthPanelProps extends React.ComponentPropsWithRef<'section'> {
+    /** Part bags the page computed for its own family. */
+    parts: AuthPanelParts;
+    /** Heading text, rendered into the derived `<h1>` that names the section. */
+    title: string;
+    /**
+     * Message rendered into the derived error Alert above the content.
+     * @default undefined — no error region renders.
+     */
+    error?: string | undefined;
+    /**
+     * Navigation rendered below the content, inside the footer region.
+     * @default undefined — no footer region renders.
+     */
+    footer?: React.ReactNode | undefined;
+}
+/**
+ * Shell of every authentication block: a `<section>` named by its own heading, wrapping a
+ * panel that holds the heading, an optional error Alert, the page's content and a footer.
+ *
+ * @internal
+ */
+export declare const AuthPanel: {
+    ({ parts, title, error, footer, children, ...rest }: AuthPanelProps): React.ReactNode;
+    displayName: string;
+};

package/dist/internal/Region.d.cts

@@ -0,0 +1,17 @@
+import type * as React from 'react';
+import type { SkdxPartAttributes } from './part.cjs';
+/** Props for {@link Region}. @internal */
+export interface RegionProps {
+    part: SkdxPartAttributes;
+    children?: React.ReactNode | undefined;
+}
+/**
+ * Optional wrapper for a consumer-supplied node: renders the part's `<div>` only when there
+ * is something to put in it, so a block's recipe stays free of one ternary per slot.
+ *
+ * @internal
+ */
+export declare const Region: {
+    ({ part, children }: RegionProps): React.ReactNode;
+    displayName: string;
+};

package/dist/internal/Region.d.ts

@@ -0,0 +1,17 @@
+import type * as React from 'react';
+import type { SkdxPartAttributes } from './part.js';
+/** Props for {@link Region}. @internal */
+export interface RegionProps {
+    part: SkdxPartAttributes;
+    children?: React.ReactNode | undefined;
+}
+/**
+ * Optional wrapper for a consumer-supplied node: renders the part's `<div>` only when there
+ * is something to put in it, so a block's recipe stays free of one ternary per slot.
+ *
+ * @internal
+ */
+export declare const Region: {
+    ({ part, children }: RegionProps): React.ReactNode;
+    displayName: string;
+};

package/dist/internal/formValue.d.cts

@@ -0,0 +1,6 @@
+/**
+ * Reads one submitted entry as a string, answering `''` for a missing entry or an uploaded file.
+ *
+ * @internal
+ */
+export declare function formValue(values: FormData, name: string): string;

package/dist/internal/formValue.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Reads one submitted entry as a string, answering `''` for a missing entry or an uploaded file.
+ *
+ * @internal
+ */
+export declare function formValue(values: FormData, name: string): string;

package/dist/notification-center/NotificationCenter.cjs

@@ -0,0 +1,2 @@
+'use client';
+"use strict";var L=Object.create;var u=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var A=Object.getPrototypeOf,B=Object.prototype.hasOwnProperty;var E=(t,e)=>{for(var n in e)u(t,n,{get:e[n],enumerable:!0})},x=(t,e,n,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of z(e))!B.call(t,o)&&o!==n&&u(t,o,{get:()=>e[o],enumerable:!(r=w(e,o))||r.enumerable});return t};var F=(t,e,n)=>(n=t!=null?L(A(t)):{},x(e||!t||!t.__esModule?u(n,"default",{value:t,enumerable:!0}):n,t)),H=t=>x(u({},"__esModule",{value:!0}),t);var D={};E(D,{NotificationCenter:()=>b});module.exports=H(D);var m=F(require("react"),1),c=require("@skdx/react"),y=require("../empty-state/EmptyState.cjs");function U(...t){let e="";for(let n of t)n&&(e=e?`${e} ${n}`:n);return e}function a(t,e,n){let r=e==="root",o=r?`skdx-${t}`:`skdx-${t}__${e}`,d={className:U(o,n),"data-part":e};return r&&(d["data-skdx-component"]=t),d}var i=require("react/jsx-runtime");function _({item:t,now:e,onSelect:n,onReadChange:r,renderLeading:o,renderActions:d,markReadLabel:p,markUnreadLabel:N}){let s=(0,i.jsxs)(m.Fragment,{children:[(0,i.jsx)("span",{...a("notification-center","item-title"),children:t.title}),t.description?(0,i.jsx)("span",{...a("notification-center","description"),children:t.description}):null,t.timestamp!==void 0?(0,i.jsx)(c.Time,{value:t.timestamp,relative:!0,now:e,...a("notification-center","time")}):null]});return(0,i.jsxs)("li",{"data-read":t.read?"":void 0,...a("notification-center","item"),children:[o?(0,i.jsx)("div",{"aria-hidden":"true",...a("notification-center","leading"),children:o(t)}):null,n?(0,i.jsx)("button",{type:"button",onClick:()=>n(t),...a("notification-center","body"),children:s}):(0,i.jsx)("div",{...a("notification-center","body"),children:s}),r||d?(0,i.jsxs)("div",{...a("notification-center","item-actions"),children:[d?.(t),r?(0,i.jsx)(c.Button,{size:"sm",variant:"ghost",onClick:()=>r(t,!t.read),...a("notification-center","read-toggle"),children:t.read?N:p}):null]}):null]})}var b=({notifications:t,title:e="Notifications",headingLevel:n=2,markAllReadLabel:r="Mark all as read",markReadLabel:o="Mark as read",markUnreadLabel:d="Mark as unread",emptyTitle:p="No notifications",emptyDescription:N,loading:s=!1,now:R,renderLeading:h,renderActions:I,actions:k,onSelect:P,onReadChange:S,onMarkAllRead:g,...v})=>{let C=m.useId(),$=t.filter(f=>!f.read).length,l;return s?l=(0,i.jsxs)("div",{"aria-hidden":"true",...a("notification-center","loading"),children:[(0,i.jsx)(c.Skeleton,{shape:"line"}),(0,i.jsx)(c.Skeleton,{shape:"line"}),(0,i.jsx)(c.Skeleton,{shape:"line"})]}):t.length===0?l=(0,i.jsx)(y.EmptyState,{title:p,description:N,size:"sm",...a("notification-center","empty")}):l=(0,i.jsx)("ul",{...a("notification-center","list"),children:t.map(f=>(0,i.jsx)(_,{item:f,now:R,onSelect:P,onReadChange:S,renderLeading:h,renderActions:I,markReadLabel:o,markUnreadLabel:d},f.id))}),(0,i.jsxs)("section",{"aria-labelledby":C,"aria-busy":s,...v,...a("notification-center","root",v.className),children:[(0,i.jsxs)("div",{...a("notification-center","header"),children:[(0,i.jsx)(c.Heading,{as:`h${n}`,id:C,...a("notification-center","title"),children:e}),k||g?(0,i.jsxs)("div",{...a("notification-center","actions"),children:[k,g?(0,i.jsx)(c.Button,{size:"sm",variant:"ghost",onClick:g,disabled:$===0,...a("notification-center","mark-all-read"),children:r}):null]}):null]}),l]})};b.displayName="NotificationCenter";0&&(module.exports={NotificationCenter});

package/dist/notification-center/NotificationCenter.d.cts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import type { NotificationCenterProps } from './types.cjs';
+/**
+ * Notification list block: read/unread state, timestamps, a leading visual
+ * and per-item and mark-all-read actions, rendered as panel content for a
+ * Popover, Drawer, Dialog or page — the block owns no overlay of its own.
+ *
+ * @example
+ * ```tsx
+ * <NotificationCenter
+ *   notifications={notifications}
+ *   onSelect={(item) => open(item)}
+ *   onReadChange={(item, read) => markRead(item.id, read)}
+ *   onMarkAllRead={() => markAllRead()}
+ * />
+ * ```
+ */
+export declare const NotificationCenter: {
+    ({ notifications, title, headingLevel, markAllReadLabel, markReadLabel, markUnreadLabel, emptyTitle, emptyDescription, loading, now, renderLeading, renderActions, actions, onSelect, onReadChange, onMarkAllRead, ...props }: NotificationCenterProps): React.ReactNode;
+    displayName: string;
+};

package/dist/notification-center/NotificationCenter.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import type { NotificationCenterProps } from './types.js';
+/**
+ * Notification list block: read/unread state, timestamps, a leading visual
+ * and per-item and mark-all-read actions, rendered as panel content for a
+ * Popover, Drawer, Dialog or page — the block owns no overlay of its own.
+ *
+ * @example
+ * ```tsx
+ * <NotificationCenter
+ *   notifications={notifications}
+ *   onSelect={(item) => open(item)}
+ *   onReadChange={(item, read) => markRead(item.id, read)}
+ *   onMarkAllRead={() => markAllRead()}
+ * />
+ * ```
+ */
+export declare const NotificationCenter: {
+    ({ notifications, title, headingLevel, markAllReadLabel, markReadLabel, markUnreadLabel, emptyTitle, emptyDescription, loading, now, renderLeading, renderActions, actions, onSelect, onReadChange, onMarkAllRead, ...props }: NotificationCenterProps): React.ReactNode;
+    displayName: string;
+};

package/dist/notification-center/NotificationCenter.js

@@ -0,0 +1,2 @@
+'use client';
+import*as u from"react";import{Button as C,Heading as L,Skeleton as g,Time as w}from"@skdx/react";import{EmptyState as z}from"../empty-state/EmptyState.js";function $(...t){let n="";for(let a of t)a&&(n=n?`${n} ${a}`:a);return n}function e(t,n,a){let o=n==="root",d=o?`skdx-${t}`:`skdx-${t}__${n}`,r={className:$(d,a),"data-part":n};return o&&(r["data-skdx-component"]=t),r}import{jsx as i,jsxs as c}from"react/jsx-runtime";function A({item:t,now:n,onSelect:a,onReadChange:o,renderLeading:d,renderActions:r,markReadLabel:m,markUnreadLabel:p}){let s=c(u.Fragment,{children:[i("span",{...e("notification-center","item-title"),children:t.title}),t.description?i("span",{...e("notification-center","description"),children:t.description}):null,t.timestamp!==void 0?i(w,{value:t.timestamp,relative:!0,now:n,...e("notification-center","time")}):null]});return c("li",{"data-read":t.read?"":void 0,...e("notification-center","item"),children:[d?i("div",{"aria-hidden":"true",...e("notification-center","leading"),children:d(t)}):null,a?i("button",{type:"button",onClick:()=>a(t),...e("notification-center","body"),children:s}):i("div",{...e("notification-center","body"),children:s}),o||r?c("div",{...e("notification-center","item-actions"),children:[r?.(t),o?i(C,{size:"sm",variant:"ghost",onClick:()=>o(t,!t.read),...e("notification-center","read-toggle"),children:t.read?p:m}):null]}):null]})}var x=({notifications:t,title:n="Notifications",headingLevel:a=2,markAllReadLabel:o="Mark all as read",markReadLabel:d="Mark as read",markUnreadLabel:r="Mark as unread",emptyTitle:m="No notifications",emptyDescription:p,loading:s=!1,now:y,renderLeading:R,renderActions:h,actions:b,onSelect:I,onReadChange:P,onMarkAllRead:N,...k})=>{let v=u.useId(),S=t.filter(f=>!f.read).length,l;return s?l=c("div",{"aria-hidden":"true",...e("notification-center","loading"),children:[i(g,{shape:"line"}),i(g,{shape:"line"}),i(g,{shape:"line"})]}):t.length===0?l=i(z,{title:m,description:p,size:"sm",...e("notification-center","empty")}):l=i("ul",{...e("notification-center","list"),children:t.map(f=>i(A,{item:f,now:y,onSelect:I,onReadChange:P,renderLeading:R,renderActions:h,markReadLabel:d,markUnreadLabel:r},f.id))}),c("section",{"aria-labelledby":v,"aria-busy":s,...k,...e("notification-center","root",k.className),children:[c("div",{...e("notification-center","header"),children:[i(L,{as:`h${a}`,id:v,...e("notification-center","title"),children:n}),b||N?c("div",{...e("notification-center","actions"),children:[b,N?i(C,{size:"sm",variant:"ghost",onClick:N,disabled:S===0,...e("notification-center","mark-all-read"),children:o}):null]}):null]}),l]})};x.displayName="NotificationCenter";export{x as NotificationCenter};

package/dist/notification-center/index.d.cts

@@ -0,0 +1,2 @@
+export { NotificationCenter } from './NotificationCenter.cjs';
+export type { NotificationCenterItem, NotificationCenterProps } from './types.cjs';

package/dist/notification-center/index.d.ts

@@ -0,0 +1,2 @@
+export { NotificationCenter } from './NotificationCenter.js';
+export type { NotificationCenterItem, NotificationCenterProps } from './types.js';

package/dist/notification-center/types.d.cts

@@ -0,0 +1,104 @@
+import type * as React from 'react';
+import type { DateInput } from '@skdx/react';
+/** One entry of {@link NotificationCenterProps.notifications} — a single notification. */
+export interface NotificationCenterItem {
+    /** Identifier reported back through every callback and used as the list item's key. */
+    id: string;
+    /** Headline text rendered as the notification's title. */
+    title: string;
+    /**
+     * Supporting copy rendered below the title.
+     * @default undefined — no description renders for this item.
+     */
+    description?: string | undefined;
+    /**
+     * Instant the notification occurred, rendered into a derived Time.
+     * @default undefined — no timestamp renders for this item.
+     */
+    timestamp?: DateInput | undefined;
+    /**
+     * Whether the notification has been read, driving `data-read` and the read-toggle label.
+     * @default undefined — treated as unread.
+     */
+    read?: boolean | undefined;
+}
+/** Props for the {@link NotificationCenter} block. */
+export interface NotificationCenterProps extends Omit<React.ComponentPropsWithRef<'section'>, 'onSelect'> {
+    /** The notifications to list, in render order. */
+    notifications: ReadonlyArray<NotificationCenterItem>;
+    /**
+     * Heading text, rendered into a derived Heading that names the section.
+     * @default 'Notifications'
+     */
+    title?: string | undefined;
+    /**
+     * Outline level of the derived title heading, from `1` down to `6`.
+     * @default 2
+     */
+    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+    /**
+     * Text of the mark-all-read button, rendered only when `onMarkAllRead` is given.
+     * @default 'Mark all as read'
+     */
+    markAllReadLabel?: string | undefined;
+    /**
+     * Text of a per-item toggle when its notification is unread.
+     * @default 'Mark as read'
+     */
+    markReadLabel?: string | undefined;
+    /**
+     * Text of a per-item toggle when its notification is read.
+     * @default 'Mark as unread'
+     */
+    markUnreadLabel?: string | undefined;
+    /**
+     * Heading text of the derived EmptyState shown when `notifications` is empty.
+     * @default 'No notifications'
+     */
+    emptyTitle?: string | undefined;
+    /**
+     * Supporting copy of the derived EmptyState shown when `notifications` is empty.
+     * @default undefined — the empty state renders with no description.
+     */
+    emptyDescription?: string | undefined;
+    /**
+     * Shows a skeleton region instead of the list while notifications are still loading.
+     * @default false
+     */
+    loading?: boolean | undefined;
+    /**
+     * Reference instant every item's relative timestamp is measured from.
+     * @default undefined — each Time reads the instant once at render.
+     */
+    now?: Date | number | undefined;
+    /**
+     * Renders a decorative avatar or icon beside one notification, always `aria-hidden`.
+     * @default undefined — no leading region renders.
+     */
+    renderLeading?: ((item: NotificationCenterItem) => React.ReactNode) | undefined;
+    /**
+     * Renders extra controls beside one notification's read/unread toggle.
+     * @default undefined — no extra per-item controls render.
+     */
+    renderActions?: ((item: NotificationCenterItem) => React.ReactNode) | undefined;
+    /**
+     * Header controls rendered beside the mark-all-read button.
+     * @default undefined — no extra header controls render.
+     */
+    actions?: React.ReactNode | undefined;
+    /**
+     * Fires when a notification's body is activated, rendered as a button only while this is given.
+     * @default undefined — a notification body renders as a plain container.
+     */
+    onSelect?: ((item: NotificationCenterItem) => void) | undefined;
+    /**
+     * Fires with the next read state when a per-item toggle is activated, rendered only while this is given.
+     * @default undefined — no per-item read toggle renders.
+     */
+    onReadChange?: ((item: NotificationCenterItem, read: boolean) => void) | undefined;
+    /**
+     * Fires when the mark-all-read button is activated, rendered only while this is given.
+     * @default undefined — no mark-all-read button renders.
+     */
+    onMarkAllRead?: (() => void) | undefined;
+}