@plitzi/sdk-shared 0.36.2 → 0.37.0

package/CHANGELOG.md

@@ -1,5 +1,60 @@
 # @plitzi/sdk-shared
 
+## 0.37.0
+
+### Minor Changes
+
+- - A `button` takes a `title`: shown as a tooltip, and its accessible name when it has no text of its own — an
+    icon-only button without one was announced as nothing. The builder's settings offer it as "Tooltip". The JSON export
+    is two files, `schema.json` and `style.json`, shown as tabs; each group of changes in the export folds away.
+
+  - `BindingTransformer.params` is `Record<string, string | number | boolean>`: a param the builder draws as a checkbox
+    (`styleVariant`'s `append`) is stored as the boolean it is and read as one, so the type now says so. The MCP compares
+    such a param with its catalog options as text. A `container` may be an `li`, for the rows of a list. The export
+    keeps every element id with `keepIds`, and the header's Publish dialog opens wider.
+
+  - **The builder exports the space on screen — on paid plans.** **Export** in the header opens a wide dialog: the
+    format as tabs (TypeScript in one file, TypeScript with a file per page as a `.zip`, or JSON), generated as soon as
+    it is picked, shown read-only in CodeMirror — beside a file list when there are several — with one row of actions,
+    **Copy** and **Download**. What the export tidied is a one-line note that unfolds into readable groups. On the free
+    plan the dialog explains what export is instead; the server refuses the code with a 402 (`limit: 'spaceExport'`)
+    whatever the builder shows. `useSpaceExport` is the one way into it, for anything else that needs the space as files.
+
+  - **A space document can be read back into code.** `specFromSpace(documents)` turns a `{ schema, style }` pair — a
+    builder export, a seed checked in as JSON — into the `SpaceSpec` that authors it, and `specToSource(spec, { exportName })`
+    writes that spec out as the TypeScript a person would write: one factory call per element, the attributes a type
+    already defaults to left out, the longhands the document stores written back as `padding: 10px 20px`, and every class
+    something names as a `styles()` declaration held in a variable. `split: true` writes one file per page and per layout.
+    `compareSpaces(expected, actual)` proves the round trip: it lists every way two pairs render differently — the tree,
+    the attributes, the rules that apply to each element whatever its selector is called, bindings, flows, pages, layouts
+    and settings — and nothing else. A selector used by one element becomes that element's own `css`; one shared, or
+    spelled out anywhere in the document (a `customCss` rule, a template), stays a class under its own name; an element id
+    nothing refers to is left out and derived again.
+
+    What an older builder left behind is repaired on the way, and every repair is reported in `corrections` rather than
+    made silently: element types that no longer exist (`navbar` → a `list` laid out in a row, `navbarItem` → `listItem`),
+    a hover stored as a class of its own (`card:hover`) folded into the class, fields and attributes no component reads,
+    a setting nothing reads, a link `target` of `_blank` (the component adds the underscore, so it rendered as `__blank`),
+    `null` or an empty list where an attribute is unset, a binding to a source nothing publishes, a flow with a step that
+    runs nothing, and a global callback registered on the wrong module. A CSS property the style editor cannot hold is
+    kept in `customCss` under the same selector, so the page still renders it.
+
+  - **What a spec can say grew to what a document holds.** A selector carries its states and variants beside its rules —
+    `styles('card', { css, states: { hover }, variants: { active } })`, and `states` on an element's own `css` — and the
+    selector cache is now written by `processSelector`, the function the style editor writes it with. An element type's
+    defaults (`elements`) take states, variants, per-breakpoint rules and `slots` for its other selectors (a modal's
+    `rootContainer`). A space declares `layouts` — shells that pages render inside, named by `layout: { id, slot }` on a
+    page or on another layout, with the slot checked to be inside the shell — and a page takes `keepState` and
+    `stateStorage`. `visible: false` starts an element hidden for a flow to reveal, and `loadStrategy` is carried through.
+    An element's own selector never takes the name of a declared class any more, however that class happens to be called.
+
+  - `elementAttributeNames` lists, as data, the attributes each built-in element can be authored with — `null` for one
+    that takes any. It is generated from the elements' attribute types (`yarn generate:attribute-names`) and a type test
+    fails when the two disagree. `defaultAttributes(type)` and `defaultLabel(type)` expose what a factory fills in.
+
+  - `CustomAttributes` accepts any attribute, because the component a custom element's `renderType` names reads its own
+    attributes off it; and `FormControlAttributes` declares `previewError`, which `withFieldValue` reads.
+
 ## 0.36.2
 
 ### Patch Changes

package/dist/index.mjs

@@ -39,28 +39,29 @@ import { fontLinkAssets as ye } from "./style/fontAssets.mjs";
 import { SYSTEM_FONTS as be, availableFonts as xe, familiesInCss as Se, fontFamilyStack as Ce, fontUrlResolver as we, fontsToHead as Te, googleCss2Url as Ee, googleTextSubsetUrl as De, isSafeFontUrl as Oe, primaryFamily as ke } from "./style/fonts.mjs";
 import { FontValidationError as Ae, parseSpaceFont as je } from "./style/fontValidation.mjs";
 import { fallbackForFamily as Me, fontsFromCss as Ne } from "./style/fontsFromCss.mjs";
-import Pe from "./schema/SchemaContext.mjs";
-import { EMPTY_SCHEMA as Fe, VARIABLE_REGEX as Ie } from "./schema/schemaConstants.mjs";
-import { findLayoutCycle as Le, resolveLayoutChain as Re } from "./schema/layoutChain.mjs";
-import { collectServerElements as ze, hasServerElements as Be } from "./schema/serverElements.mjs";
-import Ve from "./network/NetworkContext.mjs";
-import He from "./network/NetworkInternalContext.mjs";
-import { SpaceEvents as Ue, spaceEventSchemas as We, validateSpaceEvent as Ge } from "./network/spaceEvents.mjs";
-import Ke from "./network/graphql/builder/Mutations/index.mjs";
-import qe from "./network/graphql/builder/Queries/index.mjs";
-import Je from "./network/graphql/builder/Subscriptions/index.mjs";
-import Ye from "./network/graphql/sdk/Mutations/index.mjs";
-import Xe from "./network/graphql/sdk/Queries/index.mjs";
-import Ze from "./segments/SegmentsContext.mjs";
-import Qe, { RTEvent as $e, RTEventCloseCode as et, getInstance as tt, isRTEvent as nt, setInstance as rt } from "./websockets/RTCodec.mjs";
-import { THEME_CLASSES as it, THEME_COOKIE_NAME as at, applyThemeClass as ot, isTheme as st, readThemeCookie as ct, themeFromCookies as lt, writeThemeCookie as ut } from "./theme/themeCookie.mjs";
-import dt, { createThemeState as ft, createThemeStore as pt, resolveScheme as mt, setAreaTheme as ht, setMachineScheme as gt, setThemeMode as _t, themeFor as vt } from "./theme/themeStore.mjs";
-import { useThemeStore as yt } from "./theme/ThemeScope.mjs";
-import bt from "./theme/ThemeProvider.mjs";
-import xt, { SPACE_THEME_AREA as St } from "./theme/useTheme.mjs";
-import Ct from "./server/actions/useActionsSync.mjs";
-import wt, { currentRscLocation as Tt, rscDataPath as Et } from "./server/rsc/refreshRsc.mjs";
-import Dt from "./server/rsc/useRscRefresh.mjs";
-import Ot from "./server/rsc/useRscSync.mjs";
-import { runtimeStatePersist as kt } from "./state/runtimeStatePersist.mjs";
-export { d as BODYLESS_METHODS, l as BuilderContext, Ke as BuilderMutations, qe as BuilderQueries, f as CONNECTOR_HTTP_METHODS, oe as ComponentContext, p as DEFAULT_READ_ENDPOINT, ee as DevToolsContext, m as EMPTY_RESPONSE_METHODS, Fe as EMPTY_SCHEMA, he as EMPTY_STYLE_SCHEMA, Ae as FontValidationError, Ve as NetworkContext, He as NetworkInternalContext, I as ParamsFromURL, re as PlitziConsole, ue as PlitziServiceContext, de as PlitziServiceProvider, h as READ_ENDPOINT_NAMES, Qe as RTCodec, $e as RTEvent, et as RTEventCloseCode, St as SPACE_THEME_AREA, be as SYSTEM_FONTS, Pe as SchemaContext, Ye as SdkMutations, Xe as SdkQueries, Ze as SegmentsContext, Je as SpaceEventSubscription, Ue as SpaceEvents, ge as StyleBindingsAllowed, pe as StyleVariableCategory, it as THEME_CLASSES, at as THEME_COOKIE_NAME, bt as ThemeProvider, Ie as VARIABLE_REGEX, g as WRITE_ENDPOINT_NAMES, ot as applyThemeClass, e as authFailureFromResponse, xe as availableFonts, _e as baseDefaultValue, ze as collectServerElements, y as connectorPresets, _ as connectorTokens, u as contexts, i as createAuthFailureLink, ie as createStoreDevToolsLogger, K as createStripTypenameLink, ft as createThemeState, pt as createThemeStore, Tt as currentRscLocation, te as debugCookieName, L as delay, G as disableReactDevTools, b as emptyManifest, R as emptyObject, F as evaluateRuleGroup, Me as fallbackForFamily, Se as familiesInCss, S as fetchManifest, a as filters, Le as findLayoutCycle, Ce as fontFamilyStack, ye as fontLinkAssets, we as fontUrlResolver, Ne as fontsFromCss, Te as fontsToHead, T as formatDate, E as formatDateUTC, D as formatFromNow, O as formatUTCToLocal, C as generateFacade, X as getBindingsDetails, v as getConnectorTokens, z as getDisplayName, k as getDurationMs, tt as getInstance, B as getKeyDecoded, V as getPathsFromObeject, Z as getSourceName, Ee as googleCss2Url, De as googleTextSubsetUrl, Be as hasServerElements, s as hasValidToken, H as hexToRGB, ve as inheritableAttributesBase, A as isDate, U as isInViewport, ne as isInteractionFlow, nt as isRTEvent, Oe as isSafeFontUrl, st as isTheme, P as isUserEdit, j as isValidFormat, W as makeId, t as onAuthFailure, ae as pConsole, M as parseDate, je as parseSpaceFont, ke as primaryFamily, o as processTwig, ct as readThemeCookie, wt as refreshRsc, n as reportAuthFailure, Re as resolveLayoutChain, mt as resolveScheme, $ as resolveVariables, Et as rscDataPath, kt as runtimeStatePersist, r as sameRegistrableDomain, ht as setAreaTheme, rt as setInstance, gt as setMachineScheme, _t as setThemeMode, We as spaceEventSchemas, q as stripTypenameDeep, me as styleConstants, w as syntaxHighlight, c as templateRootNames, vt as themeFor, lt as themeFromCookies, dt as themeStore, N as toUnixSeconds, Ct as useActionsSync, se as useFontHead, ce as useNetwork, le as usePlitziServiceContext, Q as useRegisterSource, Dt as useRscRefresh, Ot as useRscSync, fe as useStableValue, xt as useTheme, yt as useThemeStore, J as utility, Y as utilityOptions, x as validateConnectorManifest, Ge as validateSpaceEvent, ut as writeThemeCookie };
+import { STYLE_STATES as Pe, STYLE_STATE_LABELS as Fe, inCascadeOrder as Ie, isKnownState as Le } from "./style/styleStates.mjs";
+import Re from "./schema/SchemaContext.mjs";
+import { EMPTY_SCHEMA as ze, VARIABLE_REGEX as Be } from "./schema/schemaConstants.mjs";
+import { findLayoutCycle as Ve, resolveLayoutChain as He } from "./schema/layoutChain.mjs";
+import { collectServerElements as Ue, hasServerElements as We } from "./schema/serverElements.mjs";
+import Ge from "./network/NetworkContext.mjs";
+import Ke from "./network/NetworkInternalContext.mjs";
+import { SpaceEvents as qe, spaceEventSchemas as Je, validateSpaceEvent as Ye } from "./network/spaceEvents.mjs";
+import Xe from "./network/graphql/builder/Mutations/index.mjs";
+import Ze from "./network/graphql/builder/Queries/index.mjs";
+import Qe from "./network/graphql/builder/Subscriptions/index.mjs";
+import $e from "./network/graphql/sdk/Mutations/index.mjs";
+import et from "./network/graphql/sdk/Queries/index.mjs";
+import tt from "./segments/SegmentsContext.mjs";
+import nt, { RTEvent as rt, RTEventCloseCode as it, getInstance as at, isRTEvent as ot, setInstance as st } from "./websockets/RTCodec.mjs";
+import { THEME_CLASSES as ct, THEME_COOKIE_NAME as lt, applyThemeClass as ut, isTheme as dt, readThemeCookie as ft, themeFromCookies as pt, writeThemeCookie as mt } from "./theme/themeCookie.mjs";
+import ht, { createThemeState as gt, createThemeStore as _t, resolveScheme as vt, setAreaTheme as yt, setMachineScheme as bt, setThemeMode as xt, themeFor as St } from "./theme/themeStore.mjs";
+import { useThemeStore as Ct } from "./theme/ThemeScope.mjs";
+import wt from "./theme/ThemeProvider.mjs";
+import Tt, { SPACE_THEME_AREA as Et } from "./theme/useTheme.mjs";
+import Dt from "./server/actions/useActionsSync.mjs";
+import Ot, { currentRscLocation as kt, rscDataPath as At } from "./server/rsc/refreshRsc.mjs";
+import jt from "./server/rsc/useRscRefresh.mjs";
+import Mt from "./server/rsc/useRscSync.mjs";
+import { runtimeStatePersist as Nt } from "./state/runtimeStatePersist.mjs";
+export { d as BODYLESS_METHODS, l as BuilderContext, Xe as BuilderMutations, Ze as BuilderQueries, f as CONNECTOR_HTTP_METHODS, oe as ComponentContext, p as DEFAULT_READ_ENDPOINT, ee as DevToolsContext, m as EMPTY_RESPONSE_METHODS, ze as EMPTY_SCHEMA, he as EMPTY_STYLE_SCHEMA, Ae as FontValidationError, Ge as NetworkContext, Ke as NetworkInternalContext, I as ParamsFromURL, re as PlitziConsole, ue as PlitziServiceContext, de as PlitziServiceProvider, h as READ_ENDPOINT_NAMES, nt as RTCodec, rt as RTEvent, it as RTEventCloseCode, Et as SPACE_THEME_AREA, Pe as STYLE_STATES, Fe as STYLE_STATE_LABELS, be as SYSTEM_FONTS, Re as SchemaContext, $e as SdkMutations, et as SdkQueries, tt as SegmentsContext, Qe as SpaceEventSubscription, qe as SpaceEvents, ge as StyleBindingsAllowed, pe as StyleVariableCategory, ct as THEME_CLASSES, lt as THEME_COOKIE_NAME, wt as ThemeProvider, Be as VARIABLE_REGEX, g as WRITE_ENDPOINT_NAMES, ut as applyThemeClass, e as authFailureFromResponse, xe as availableFonts, _e as baseDefaultValue, Ue as collectServerElements, y as connectorPresets, _ as connectorTokens, u as contexts, i as createAuthFailureLink, ie as createStoreDevToolsLogger, K as createStripTypenameLink, gt as createThemeState, _t as createThemeStore, kt as currentRscLocation, te as debugCookieName, L as delay, G as disableReactDevTools, b as emptyManifest, R as emptyObject, F as evaluateRuleGroup, Me as fallbackForFamily, Se as familiesInCss, S as fetchManifest, a as filters, Ve as findLayoutCycle, Ce as fontFamilyStack, ye as fontLinkAssets, we as fontUrlResolver, Ne as fontsFromCss, Te as fontsToHead, T as formatDate, E as formatDateUTC, D as formatFromNow, O as formatUTCToLocal, C as generateFacade, X as getBindingsDetails, v as getConnectorTokens, z as getDisplayName, k as getDurationMs, at as getInstance, B as getKeyDecoded, V as getPathsFromObeject, Z as getSourceName, Ee as googleCss2Url, De as googleTextSubsetUrl, We as hasServerElements, s as hasValidToken, H as hexToRGB, Ie as inCascadeOrder, ve as inheritableAttributesBase, A as isDate, U as isInViewport, ne as isInteractionFlow, Le as isKnownState, ot as isRTEvent, Oe as isSafeFontUrl, dt as isTheme, P as isUserEdit, j as isValidFormat, W as makeId, t as onAuthFailure, ae as pConsole, M as parseDate, je as parseSpaceFont, ke as primaryFamily, o as processTwig, ft as readThemeCookie, Ot as refreshRsc, n as reportAuthFailure, He as resolveLayoutChain, vt as resolveScheme, $ as resolveVariables, At as rscDataPath, Nt as runtimeStatePersist, r as sameRegistrableDomain, yt as setAreaTheme, st as setInstance, bt as setMachineScheme, xt as setThemeMode, Je as spaceEventSchemas, q as stripTypenameDeep, me as styleConstants, w as syntaxHighlight, c as templateRootNames, St as themeFor, pt as themeFromCookies, ht as themeStore, N as toUnixSeconds, Dt as useActionsSync, se as useFontHead, ce as useNetwork, le as usePlitziServiceContext, Q as useRegisterSource, jt as useRscRefresh, Mt as useRscSync, fe as useStableValue, Tt as useTheme, Ct as useThemeStore, J as utility, Y as utilityOptions, x as validateConnectorManifest, Ye as validateSpaceEvent, mt as writeThemeCookie };

package/dist/network/spaceEvents.d.ts

@@ -103,13 +103,16 @@ export declare const spaceEventSchemas: {
             styleSelector: z.ZodOptional<z.ZodString>;
             styleState: z.ZodOptional<z.ZodEnum<{
                 hover: "hover";
-                active: "active";
                 focus: "focus";
+                "focus-visible": "focus-visible";
+                "focus-within": "focus-within";
+                active: "active";
                 disabled: "disabled";
                 checked: "checked";
                 visited: "visited";
             }>>;
             styleVariant: z.ZodOptional<z.ZodString>;
+            styleAncestor: z.ZodOptional<z.ZodString>;
         }, z.core.$strip>;
     }, z.core.$strip>;
     readonly STYLE_UPDATE_SELECTOR: z.ZodObject<{
@@ -125,13 +128,16 @@ export declare const spaceEventSchemas: {
             componentType: z.ZodOptional<z.ZodString>;
             styleState: z.ZodOptional<z.ZodEnum<{
                 hover: "hover";
-                active: "active";
                 focus: "focus";
+                "focus-visible": "focus-visible";
+                "focus-within": "focus-within";
+                active: "active";
                 disabled: "disabled";
                 checked: "checked";
                 visited: "visited";
             }>>;
             styleVariant: z.ZodOptional<z.ZodString>;
+            styleAncestor: z.ZodOptional<z.ZodString>;
             styleSelector: z.ZodString;
         }, z.core.$strip>;
     }, z.core.$strip>;
@@ -292,13 +298,16 @@ export declare const spaceEventSchemas: {
             styleSelector: z.ZodOptional<z.ZodString>;
             styleState: z.ZodOptional<z.ZodEnum<{
                 hover: "hover";
-                active: "active";
                 focus: "focus";
+                "focus-visible": "focus-visible";
+                "focus-within": "focus-within";
+                active: "active";
                 disabled: "disabled";
                 checked: "checked";
                 visited: "visited";
             }>>;
             styleVariant: z.ZodOptional<z.ZodString>;
+            styleAncestor: z.ZodOptional<z.ZodString>;
         }, z.core.$strip>;
         contextId: z.ZodString;
     }, z.core.$strip>;
@@ -315,13 +324,16 @@ export declare const spaceEventSchemas: {
             componentType: z.ZodOptional<z.ZodString>;
             styleState: z.ZodOptional<z.ZodEnum<{
                 hover: "hover";
-                active: "active";
                 focus: "focus";
+                "focus-visible": "focus-visible";
+                "focus-within": "focus-within";
+                active: "active";
                 disabled: "disabled";
                 checked: "checked";
                 visited: "visited";
             }>>;
             styleVariant: z.ZodOptional<z.ZodString>;
+            styleAncestor: z.ZodOptional<z.ZodString>;
             styleSelector: z.ZodString;
         }, z.core.$strip>;
         contextId: z.ZodString;