@vectoriox/iox-ui 5.82.2 → 5.83.0

package/fesm2022/vectoriox-iox-ui-generation-core.mjs

@@ -1,5 +1,5 @@
 import { NEW_NODE_STYLE_DEFAULTS, defaultElementStyleFor, elementStyleById, ownedTraitsOf, applyElementStyle, flavorPackById, parseHexColor, SPEC_AXES, EntranceParam, staggerDelay, LinkType, COLOR_SCHEMES, setColorScheme, resolveDesignChoices, ANIMATE_IDS, auditDesignContrast } from '@vectoriox/iox-ui/design-core';
-import { formPresetById, FORM_PRESETS, ControlType, FORM_NODE_TYPE, collectFormSpec, FIELD_NODE_TYPE } from '@vectoriox/iox-ui/forms-core';
+import { formPresetById, FORM_ACTIONS_ROLE, channelOpensNewTab, FORM_CHANNEL_ROLE, planFormPresetIds, ControlType, FORM_NODE_TYPE, collectFormSpec, FIELD_NODE_TYPE, isChannelFilled } from '@vectoriox/iox-ui/forms-core';
 import { normalizeFrameSequence, filmScreensFor, FILM_PREPARED_PICTURES, FrameExtension } from '@vectoriox/iox-ui/media-core';
 import { SEO_DESCRIPTION_MAX, SEO_TITLE_MAX } from '@vectoriox/iox-ui/seo-core';
 import { pickTabsAutoBinds, pickAccordionAutoBinds, segmentedOptions, ITEM_OPEN_STATE, CardPart, CardRole, CardLayout, CARD_LAYOUTS, CARD_PARTS, BADGE_TONES, buildCardRecipe, findByRole, buildSegmentedRecipe, AccordionRole, buildAccordionRecipe, ACCORDION_WORDS, accordionItems, accordionQuestionOf, accordionAnswerOf, ACCORDION_BIND_PROP, ACCORDION_CONTENT_LIMIT, buildTabsRecipe, TABS_WORDS, tabsTriggers, tabLabelNodeOf, TABS_LABEL_BIND_PROP, tabsPanels, tabPanelTextOf, TABS_TEXT_BIND_PROP, tabPanelImageOf, tabsListOf, tabsPanelsOf, TABS_CONTENT_LIMIT, TABS_IMAGE_BIND_PROP, buildCarouselRecipe, SLIDE_TYPE, buildLightboxRecipe, LIGHTBOX_LABEL, SLIDE_TO_ROW } from '@vectoriox/iox-ui/composite-core';
@@ -9610,6 +9610,10 @@ const NODE_BASELINES = {
             "label": "Label",
             "control": "text",
             "placeholder": "",
+            "multiple": false,
+            "appearance": "chips",
+            "earliest": "",
+            "latest": "",
             "help": "",
             "rows": 4,
             "rangeMin": 0,
@@ -9713,6 +9717,10 @@ const NODE_BASELINES = {
             "label",
             "control",
             "placeholder",
+            "multiple",
+            "appearance",
+            "earliest",
+            "latest",
             "help",
             "rows",
             "rangeMin",
@@ -10016,6 +10024,7 @@ const NODE_BASELINES = {
         "props": {
             "label": "Send",
             "loadingLabel": "Sending…",
+            "sentLabel": "",
             "disableWhileSubmitting": true
         },
         "styleProps": {
@@ -10107,6 +10116,7 @@ const NODE_BASELINES = {
         "traits": [
             "label",
             "loadingLabel",
+            "sentLabel",
             "disableWhileSubmitting"
         ],
         "styleTraits": [
@@ -13186,7 +13196,10 @@ const FORM_SUCCESS = 'FormSuccess';
 const FORM_ERROR = 'FormError';
 const FORM_STATE_BLOCKS = [FORM_SUCCESS, FORM_ERROR];
 /** The Field traits a preset field fills, 1:1 (`FormPresetField`). */
-const PRESET_FIELD_PROPS = ['label', 'control', 'required', 'help', 'placeholder', 'optionsText', 'rows'];
+const PRESET_FIELD_PROPS = ['label', 'control', 'required', 'help', 'placeholder', 'optionsText', 'rows', 'multiple', 'appearance', 'earliest', 'latest'];
+const FIELD_GROUP = 'FieldGroup';
+/** The second channel beside Send (premium N2): the quieter button. */
+const CHANNEL_STYLE = 'button-secondary';
 const LABEL_TAG = 'span';
 const TEXT = 'Text';
 /** A button's label reads the button's own type and ink (contract element style, W1.1 Q6). */
@@ -13414,7 +13427,22 @@ function presetChildren(preset, id) {
         block.children = [create(`${id}-${n + 1 + i}-0`, TEXT, { content: words })];
         return block;
     });
-    return [...fields, submit, ...blocks];
+    return [...fields, preset.channel ? actionsRow(submit, preset.channel, `${id}-${n}`) : submit, ...blocks];
+}
+/**
+ * Send and the second channel in ONE row (premium N2), the way the builder's tray builds it (iox-builder
+ * `buildFormActionsRow`): the channel's address is the studio's own fact and starts EMPTY — the Publishable gate
+ * blocks publishing until it is filled (`auditSite`, empty-channel). Never a number written for it.
+ */
+function actionsRow(submit, channel, id) {
+    const row = create(`${id}-row`, FIELD_GROUP);
+    row.role = FORM_ACTIONS_ROLE;
+    Object.assign(row.styleProps, { flexWrap: 'wrap', alignItems: 'center', gap: '12px' });
+    const button = create(`${id}-channel`, BUTTON_BLOCK, { tag: 'a', linkType: LinkType.External, href: '', target: channelOpensNewTab(channel.kind) ? '_blank' : '_self' }, CHANNEL_STYLE);
+    button.role = FORM_CHANNEL_ROLE;
+    button.children = [create(`${id}-channel-0`, TEXT, { content: channel.label }, BUTTON_LABEL_STYLE)];
+    row.children = [submit, button];
+    return row;
 }
 /** A Form: its stable id, its preset's name and children (or the pattern's own children), and both state
  *  blocks — never optional (forms plan D7). */
@@ -14895,7 +14923,7 @@ function wireSectionJsonSchema() {
         links: jsonListOf(shaped(PlanWireEntry.SlotLink, { slot: closedOrText(unique(patterns.flatMap(patternLinkSlots))), route: jsonText() })),
         binding: jsonText(),
         without: jsonListOf(closedOrText(unique(patterns.flatMap(patternOptionalParts)))),
-        form: orNone(FORM_PRESETS.map(p => p.id)),
+        form: orNone(planFormPresetIds()),
         enter: orNone(ANIMATE_IDS),
     });
 }
@@ -16138,6 +16166,9 @@ var SiteFindingCode;
     SiteFindingCode["NoHeader"] = "no-header";
     SiteFindingCode["NoPhoneMenu"] = "no-phone-menu";
     SiteFindingCode["FormWithoutId"] = "form-without-id";
+    /** Premium N2: a form's second way to reach you (WhatsApp, a phone, an email) has no address yet — the studio's own
+     *  fact, never written for it. */
+    SiteFindingCode["EmptyChannel"] = "empty-channel";
     SiteFindingCode["EmailNeedsMailer"] = "email-needs-mailer";
     SiteFindingCode["TrackerWithoutBanner"] = "tracker-without-banner";
     SiteFindingCode["NoTitle"] = "no-title";
@@ -16161,6 +16192,7 @@ const FINDING_SEVERITY = {
     [SiteFindingCode.NoHeader]: CheckSeverity.Warn,
     [SiteFindingCode.NoPhoneMenu]: CheckSeverity.Warn,
     [SiteFindingCode.FormWithoutId]: CheckSeverity.Block,
+    [SiteFindingCode.EmptyChannel]: CheckSeverity.Block,
     [SiteFindingCode.EmailNeedsMailer]: CheckSeverity.Warn,
     [SiteFindingCode.TrackerWithoutBanner]: CheckSeverity.Warn,
     [SiteFindingCode.NoTitle]: CheckSeverity.Warn,
@@ -16183,6 +16215,7 @@ const CHECK_OF = {
     [SiteFindingCode.NoHeader]: SiteCheckId.Navigation,
     [SiteFindingCode.NoPhoneMenu]: SiteCheckId.Navigation,
     [SiteFindingCode.FormWithoutId]: SiteCheckId.Forms,
+    [SiteFindingCode.EmptyChannel]: SiteCheckId.Forms,
     [SiteFindingCode.EmailNeedsMailer]: SiteCheckId.Forms,
     [SiteFindingCode.TrackerWithoutBanner]: SiteCheckId.Consent,
     [SiteFindingCode.NoTitle]: SiteCheckId.Seo,
@@ -16274,6 +16307,9 @@ function checkForms(ctx, snapshot, pages) {
         walkSerialized(n.children ?? [], f => {
             if (f.type === FIELD_NODE_TYPE && PERSONAL_CONTROLS.has(String(f.props['control'] ?? ControlType.Text)))
                 personal = true;
+            if (f.role === FORM_CHANNEL_ROLE && !isChannelFilled(f.props['href'])) {
+                add(ctx, SiteFindingCode.EmptyChannel, 'A form\'s second way to reach you has no number or address yet — only you can fill it in.', { ...where, nodeId: f.id });
+            }
         });
     });
     return personal;