@xenosystem/components 0.5.0 → 0.7.0

package/dist/auth/index.d.ts

@@ -44,8 +44,10 @@ interface SignInFormProps {
     animate?: boolean;
     /** Diagnostic hook the panel sets to its phase; carried to the DOM as `data-phase`. */
     phase?: string;
+    /** One callback for every action (a declaration binds this once); an action's own `onClick` still wins. */
+    onAction?: (id: string) => void;
 }
-declare function SignInForm({ tag, title, body, actions, note, warning, identity, animate, phase }: SignInFormProps): react.JSX.Element;
+declare function SignInForm({ tag, title, body, actions, note, warning, identity, animate, phase, onAction }: SignInFormProps): react.JSX.Element;
 /** The licence plates are the same form with a tag; kept as a name so a panel reads honestly. */
 declare const LicencePlate: typeof SignInForm;
 

package/dist/auth/index.js

@@ -19,7 +19,7 @@ var CSS = `
 .xc-auth[data-aspect=square] .xc-brand svg,.xc-auth__head .xc-brand svg{width:20px;height:20px}
 .xc-brand__word{font-size:13px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
 .xc-auth[data-aspect=square] .xc-brand__word,.xc-auth__head .xc-brand__word{font-size:11px}
-.xc-hero__h1{font-size:3.5rem;font-weight:700;line-height:1.1;letter-spacing:-.02em;max-width:32rem}
+.xc-hero__h1{font-size:3.5rem;font-weight:700;line-height:1.1;letter-spacing:-.02em;max-width:32rem;white-space:pre-line}
 .xc-auth[data-aspect=square] .xc-hero__h1{font-size:2rem}
 .xc-hero__lead{margin-top:16px;max-width:24rem;font-size:16px;line-height:1.6}
 .xc-hero__stats{display:flex;align-items:center;gap:32px}
@@ -134,7 +134,7 @@ function AuthHero({ headline, lead, stats, imageSrc, compact }) {
 import { useEffect, useState } from "react";
 import { Button } from "@xenosystem/elements-react";
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function SignInForm({ tag, title, body, actions, note, warning, identity, animate = true, phase }) {
+function SignInForm({ tag, title, body, actions, note, warning, identity, animate = true, phase, onAction }) {
   useAuthStyles();
   const [visible, setVisible] = useState(!animate);
   useEffect(() => {
@@ -146,7 +146,7 @@ function SignInForm({ tag, title, body, actions, note, warning, identity, animat
     tag && /* @__PURE__ */ jsx3("span", { className: "xc-form__tag", children: tag }),
     /* @__PURE__ */ jsx3("h2", { className: "xc-form__h2", children: title }),
     /* @__PURE__ */ jsx3("p", { className: "xc-form__sub", children: body }),
-    actions.length > 0 && /* @__PURE__ */ jsx3("div", { className: "xc-form__actions", children: actions.map((a) => /* @__PURE__ */ jsx3(Button, { variant: a.variant ?? "secondary", size: "lg", disabled: a.disabled, onClick: a.onClick, "data-intent": a.id, children: a.label }, a.id)) }),
+    actions.length > 0 && /* @__PURE__ */ jsx3("div", { className: "xc-form__actions", children: actions.map((a) => /* @__PURE__ */ jsx3(Button, { variant: a.variant ?? "secondary", size: "lg", disabled: a.disabled, onClick: a.onClick ?? (onAction ? () => onAction(a.id) : void 0), "data-intent": a.id, children: a.label }, a.id)) }),
     note && /* @__PURE__ */ jsx3("p", { className: "xc-form__note", children: note }),
     warning && /* @__PURE__ */ jsx3("p", { className: "xc-form__warn", children: warning }),
     identity && /* @__PURE__ */ jsxs3("p", { className: "xc-form__who", children: [

package/dist/catalog.d.ts

@@ -0,0 +1,7 @@
+/** The shape of `@xenosystem/components/catalog` (dist/catalog.json) — see scripts/catalog.mjs. */
+export interface CatalogProp { name: string; type: string; optional: boolean; doc: string }
+export interface CatalogUnit { name: string; file: string; doc: string; props: string | null; propList: CatalogProp[] }
+export interface CatalogFamily { family: string; units: CatalogUnit[] }
+export interface Catalog { generatedFrom: string; families: CatalogFamily[] }
+declare const catalog: Catalog
+export default catalog

package/dist/catalog.json

@@ -0,0 +1,337 @@
+{
+  "generatedFrom": "@xenosystem/components (source, at build)",
+  "families": [
+    {
+      "family": "auth",
+      "units": [
+        {
+          "name": "AuthDoor",
+          "file": "AuthDoor.tsx",
+          "doc": "Hub's three aspect modes, measured on the door's OWN box — in a product the door is `inset: 0`\nand the two agree; in a harness it is a tile, and a component lays itself out for the box it\nwas given.",
+          "props": "AuthDoorProps",
+          "propList": [
+            {
+              "name": "hero",
+              "type": "Omit<AuthHeroProps, 'compact'>",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "label",
+              "type": "string",
+              "optional": false,
+              "doc": "Aria label of the dialog."
+            },
+            {
+              "name": "children",
+              "type": "ReactNode",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "rootAttributes",
+              "type": "Record<string, string | undefined>",
+              "optional": true,
+              "doc": "Diagnostic: carried to the root as `data-xeno-auth-gate` by the panel."
+            }
+          ]
+        },
+        {
+          "name": "AuthHero",
+          "file": "AuthHero.tsx",
+          "doc": "",
+          "props": "AuthHeroProps",
+          "propList": [
+            {
+              "name": "headline",
+              "type": "ReactNode",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "lead",
+              "type": "ReactNode",
+              "optional": true,
+              "doc": ""
+            },
+            {
+              "name": "stats",
+              "type": "AuthHeroStat[]",
+              "optional": true,
+              "doc": ""
+            },
+            {
+              "name": "imageSrc",
+              "type": "string",
+              "optional": true,
+              "doc": ""
+            },
+            {
+              "name": "compact",
+              "type": "boolean",
+              "optional": true,
+              "doc": "`banner` is the short form (the square aspect): brand + headline only."
+            }
+          ]
+        },
+        {
+          "name": "CredentialForm",
+          "file": "CredentialForm.tsx",
+          "doc": "",
+          "props": "CredentialFormProps",
+          "propList": [
+            {
+              "name": "mode",
+              "type": "CredentialMode",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "onModeChange",
+              "type": "(mode: CredentialMode) => void",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "values",
+              "type": "CredentialValues",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "onChange",
+              "type": "(values: CredentialValues) => void",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "errors",
+              "type": "CredentialErrors",
+              "optional": true,
+              "doc": ""
+            },
+            {
+              "name": "submitting",
+              "type": "boolean",
+              "optional": true,
+              "doc": ""
+            },
+            {
+              "name": "onSubmit",
+              "type": "() => void",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "title",
+              "type": "ReactNode",
+              "optional": true,
+              "doc": "Rendered above the switch — the page's \"Welcome back\" / \"Get started\" copy."
+            },
+            {
+              "name": "body",
+              "type": "ReactNode",
+              "optional": true,
+              "doc": ""
+            },
+            {
+              "name": "before",
+              "type": "ReactNode",
+              "optional": true,
+              "doc": "Rendered between the switch and the fields — `SocialSignIn` + `OrDivider`, when the page has them."
+            },
+            {
+              "name": "after",
+              "type": "ReactNode",
+              "optional": true,
+              "doc": "Rendered under the submit — \"Forgot password?\", terms, the other-mode link."
+            },
+            {
+              "name": "passwordRules",
+              "type": "{ label: string; met: boolean }[]",
+              "optional": true,
+              "doc": "Live password rules (sign-up): shown while the field is focused or partly filled — never before,\n a list of things you have failed before you typed is a telling-off for a crime not yet committed."
+            },
+            {
+              "name": "passwordAside",
+              "type": "ReactNode",
+              "optional": true,
+              "doc": "Rendered beside the password label — the page's \"Forgot?\" link on sign-in."
+            },
+            {
+              "name": "open",
+              "type": "boolean",
+              "optional": true,
+              "doc": "When false, the fields collapse (0fr grid) and leave the accessibility tree; the page's disclosure\n controls it. Default open."
+            },
+            {
+              "name": "id",
+              "type": "string",
+              "optional": true,
+              "doc": "id for the collapsible region (matched by `EmailDisclosure.controls`)."
+            },
+            {
+              "name": "labels",
+              "type": "Partial<Record<'name' | 'email' | 'password' | 'submitSignIn' | 'submitSignUp' | 'signin' | 'signup', string>>",
+              "optional": true,
+              "doc": "Copy overrides; defaults are the platform page's."
+            }
+          ]
+        },
+        {
+          "name": "EmailDisclosure",
+          "file": "EmailDisclosure.tsx",
+          "doc": "",
+          "props": "EmailDisclosureProps",
+          "propList": [
+            {
+              "name": "open",
+              "type": "boolean",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "onToggle",
+              "type": "() => void",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "controls",
+              "type": "string",
+              "optional": false,
+              "doc": "id of the form region it controls."
+            },
+            {
+              "name": "openLabel",
+              "type": "string",
+              "optional": true,
+              "doc": ""
+            },
+            {
+              "name": "closedLabel",
+              "type": "string",
+              "optional": true,
+              "doc": ""
+            }
+          ]
+        },
+        {
+          "name": "OrDivider",
+          "file": "OrDivider.tsx",
+          "doc": "The \"or continue with email\" rule between the social row and the fields.",
+          "props": null,
+          "propList": [
+            {
+              "name": "children",
+              "type": "string",
+              "optional": true,
+              "doc": ""
+            }
+          ]
+        },
+        {
+          "name": "SignInForm",
+          "file": "SignInForm.tsx",
+          "doc": "",
+          "props": "SignInFormProps",
+          "propList": [
+            {
+              "name": "tag",
+              "type": "string",
+              "optional": true,
+              "doc": "A small uppercase tag above the heading — `No active plan`, `Update required`."
+            },
+            {
+              "name": "title",
+              "type": "ReactNode",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "body",
+              "type": "ReactNode",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "actions",
+              "type": "SignInAction[]",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "note",
+              "type": "ReactNode",
+              "optional": true,
+              "doc": "Explanatory note under the actions (where the credential is entered, etc)."
+            },
+            {
+              "name": "warning",
+              "type": "ReactNode",
+              "optional": true,
+              "doc": "A warning line — the host's own sentence about what went wrong."
+            },
+            {
+              "name": "identity",
+              "type": "string",
+              "optional": true,
+              "doc": "Who is signed in, when known — display only."
+            },
+            {
+              "name": "animate",
+              "type": "boolean",
+              "optional": true,
+              "doc": "The entrance fade; `false` renders settled (tests, screenshots)."
+            },
+            {
+              "name": "phase",
+              "type": "string",
+              "optional": true,
+              "doc": "Diagnostic hook the panel sets to its phase; carried to the DOM as `data-phase`."
+            },
+            {
+              "name": "onAction",
+              "type": "(id: string) => void",
+              "optional": true,
+              "doc": "One callback for every action (a declaration binds this once); an action's own `onClick` still wins."
+            }
+          ]
+        },
+        {
+          "name": "SocialSignIn",
+          "file": "SocialSignIn.tsx",
+          "doc": "",
+          "props": "SocialSignInProps",
+          "propList": [
+            {
+              "name": "providers",
+              "type": "readonly SocialProvider[]",
+              "optional": true,
+              "doc": ""
+            },
+            {
+              "name": "onSelect",
+              "type": "(provider: SocialProvider) => void",
+              "optional": false,
+              "doc": ""
+            },
+            {
+              "name": "disabled",
+              "type": "boolean",
+              "optional": true,
+              "doc": ""
+            }
+          ]
+        },
+        {
+          "name": "XenoMark",
+          "file": "XenoMark.tsx",
+          "doc": "",
+          "props": null,
+          "propList": []
+        }
+      ]
+    }
+  ]
+}

package/dist/index.d.ts

@@ -3,6 +3,6 @@
  * Families are subpaths: `@xenosystem/components/auth`, `/navigation`, `/feedback`, `/data`.
  * This root re-exports nothing on purpose: import the family you use, so a bundle carries only it.
  */
-declare const COMPONENTS_VERSION = "0.5.0";
+declare const COMPONENTS_VERSION = "0.6.0";
 
 export { COMPONENTS_VERSION };

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/index.ts
-var COMPONENTS_VERSION = "0.5.0";
+var COMPONENTS_VERSION = "0.6.0";
 export {
   COMPONENTS_VERSION
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@xenosystem/components",
-  "version": "0.5.0",
-  "description": "XENO Components — rung 2 of the front ladder: molecules composed from @xenosystem/elements, with no host contract. Families as subpaths: /auth, /navigation, /feedback, /data.",
+  "version": "0.7.0",
+  "description": "XENO Components \u2014 rung 2 of the front ladder: molecules composed from @xenosystem/elements, with no host contract. Families as subpaths: /auth, /navigation, /feedback, /data.",
   "license": "UNLICENSED",
   "type": "module",
   "sideEffects": false,
@@ -13,6 +13,10 @@
     "./auth": {
       "types": "./dist/auth/index.d.ts",
       "import": "./dist/auth/index.js"
+    },
+    "./catalog": {
+      "types": "./dist/catalog.d.ts",
+      "default": "./dist/catalog.json"
     }
   },
   "files": [
@@ -20,10 +24,11 @@
     "README.md"
   ],
   "scripts": {
-    "build": "tsup",
+    "build": "tsup && node scripts/catalog.mjs",
     "typecheck": "tsc --noEmit",
     "test": "vitest run",
-    "prepublishOnly": "node scripts/verify-dist.mjs"
+    "prepublishOnly": "node scripts/verify-dist.mjs",
+    "catalog:check": "node scripts/catalog.mjs --check"
   },
   "peerDependencies": {
     "@xenosystem/elements-react": ">=0.0.1",