@vectoriox/iox-builder 4.32.2 → 4.33.0

package/fesm2022/vectoriox-iox-builder.mjs

@@ -10000,6 +10000,56 @@ function buildFormPreset(def, createConfig) {
     form.children = children;
     return form;
 }
+const FIELD_KIND_PRESETS = Object.freeze([
+    {
+        control: 'checkbox', name: 'Checkbox', icon: 'ph-thin ph-check-square',
+        description: 'One tick. Making it required turns it into a must-accept.',
+        label: 'I agree',
+    },
+    {
+        control: 'switch', name: 'Switch', icon: 'ph-thin ph-toggle-left',
+        description: 'An on/off toggle — records true or false.',
+        label: 'Enable',
+    },
+    {
+        control: 'radio', name: 'Radio group', icon: 'ph-thin ph-radio-button',
+        description: 'Pick exactly one of a few visible choices.',
+        label: 'Pick one',
+        optionsText: 'First choice\nSecond choice\nThird choice',
+    },
+    {
+        control: 'select', name: 'Dropdown', icon: 'ph-thin ph-caret-circle-down',
+        description: 'Pick one from a list that folds away.',
+        label: 'Choose',
+        optionsText: 'First choice\nSecond choice\nThird choice',
+    },
+    {
+        control: 'range', name: 'Slider', icon: 'ph-thin ph-sliders-horizontal',
+        description: 'A number by sliding between a min and a max.',
+        label: 'How much',
+    },
+    {
+        control: 'date', name: 'Date', icon: 'ph-thin ph-calendar-blank',
+        description: 'A calendar date.',
+        label: 'Date',
+    },
+    {
+        control: 'time', name: 'Time', icon: 'ph-thin ph-clock',
+        description: 'A time of day.',
+        label: 'Time',
+    },
+]);
+/** One pre-set Field. Null when the registry lacks the type — never a half-built node. */
+function buildFieldKindPreset(def, createConfig) {
+    const field = createConfig('Field');
+    if (!field)
+        return null;
+    setTrait(field, 'label', def.label);
+    setTrait(field, 'control', def.control);
+    if (def.optionsText)
+        setTrait(field, 'optionsText', def.optionsText);
+    return field;
+}
 function textNode(content, createConfig) {
     const text = createConfig('Text');
     if (!text)
@@ -10063,25 +10113,34 @@ function button(label, createConfig, interaction, styles = {}) {
     return btn;
 }
 /** The C1/C2 board button voices — Swiss by fallback, the brand's the moment tokens seed. */
+// width:'auto' + flexShrink:'0' on every voice: a consent button never stretches to its row's
+// height nor shrinks until its label wraps — both happened on the canvas (Rule 0, 2026-10-10).
 const SOLID = {
     backgroundColor: TOKEN$1('brand-500', '#1f1d1b'), color: TOKEN$1('brandInk', '#ffffff'),
     fontSize: '12px', fontWeight: '600', padding: '9px 16px',
     borderRadius: TOKEN$1('radius-control', '4px'),
+    width: 'auto', flexShrink: '0',
 };
 const OUTLINED = {
     backgroundColor: 'transparent', color: TOKEN$1('ink', '#1f1d1b'),
     borderWidth: '1px', borderStyle: 'solid', borderColor: TOKEN$1('ink', '#1f1d1b'),
     fontSize: '12px', fontWeight: '600', padding: '8px 16px',
     borderRadius: TOKEN$1('radius-control', '4px'),
+    width: 'auto', flexShrink: '0',
 };
 const QUIET = {
     backgroundColor: 'transparent', color: TOKEN$1('inkMuted', '#4a453f'),
     fontSize: '11px', fontWeight: '400', padding: '2px 4px', textDecoration: 'underline',
+    width: 'auto', flexShrink: '0',
 };
 function row(createConfig, styles, children) {
     const container = createConfig('Container');
     if (!container || children.some(c => !c))
         return null;
+    // The Container config defaults (minHeight 200px — the canvas droppability affordance) are
+    // serialized with the node, so a preset box must OWN its height or every card ships 200px
+    // tall with dead space (Rule 0 catch, 2026-10-10). Callers may still override.
+    setStyleTrait(container, 'minHeight', 'auto');
     for (const [prop, value] of Object.entries(styles))
         setStyleTrait(container, prop, value);
     container.children = children;
@@ -10111,7 +10170,9 @@ function buildConsentPreset(createConfig) {
     const heading = text$1('Cookies on this site', { fontSize: '13px', fontWeight: '600', color: TOKEN$1('ink', '#1f1d1b') }, createConfig);
     // The first layer NAMES the three categories (plan §7) — the board does it in the copy.
     const body = text$1('We use analytics and marketing cookies only if you allow them. Necessary ones always run.', { fontSize: '11px', color: TOKEN$1('inkMuted', '#4a453f'), lineHeight: '1.5', maxWidth: '330px' }, createConfig);
-    const textCol = row(createConfig, { display: 'flex', flexDirection: 'column', gap: '4px', flexGrow: '1' }, [heading, body]);
+    // width:'auto' throughout — the Container default is 100%, and two 100%-wide columns
+    // cannot share the bar's row (they wrap into a stack; Rule 0 catch, 2026-10-10).
+    const textCol = row(createConfig, { display: 'flex', flexDirection: 'column', gap: '4px', flexGrow: '1', width: 'auto' }, [heading, body]);
     const accept = button('Accept all', createConfig, click([
         { type: 'grantConsent' },
         { type: 'closeDialog', target: banner.id },
@@ -10123,9 +10184,9 @@ function buildConsentPreset(createConfig) {
     const prefs = button('Preferences', createConfig, click([
         { type: 'openConsentPreferences', target: preferences.id },
     ]), QUIET);
-    const acceptRejectRow = row(createConfig, { display: 'flex', gap: '7px' }, [accept, reject]);
-    const buttonsCol = row(createConfig, { display: 'flex', flexDirection: 'column', gap: '7px', alignItems: 'center' }, [acceptRejectRow, prefs]);
-    const bannerRow = row(createConfig, { display: 'flex', gap: '18px', alignItems: 'flex-start', flexWrap: 'wrap' }, [textCol, buttonsCol]);
+    const acceptRejectRow = row(createConfig, { display: 'flex', gap: '7px', alignItems: 'center', width: 'auto' }, [accept, reject]);
+    const buttonsCol = row(createConfig, { display: 'flex', flexDirection: 'column', gap: '7px', alignItems: 'center', width: 'auto', flexShrink: '0' }, [acceptRejectRow, prefs]);
+    const bannerRow = row(createConfig, { display: 'flex', gap: '18px', alignItems: 'center', flexWrap: 'wrap' }, [textCol, buttonsCol]);
     if (!bannerRow)
         return null;
     banner.children = [bannerRow];
@@ -10147,11 +10208,12 @@ function buildConsentPreset(createConfig) {
     };
     const nameText = (s) => text$1(s, { fontSize: '13px', fontWeight: '600', color: TOKEN$1('ink', '#1f1d1b') }, createConfig);
     const descText = (s) => text$1(s, { fontSize: '11px', color: TOKEN$1('inkMuted', '#6b6560'), lineHeight: '1.5' }, createConfig);
-    const textColOf = (name, desc) => row(createConfig, { display: 'flex', flexDirection: 'column', gap: '2px', flexGrow: '1' }, [nameText(name), descText(desc)]);
+    const textColOf = (name, desc) => row(createConfig, { display: 'flex', flexDirection: 'column', gap: '2px', flexGrow: '1', width: 'auto' }, [nameText(name), descText(desc)]);
     const alwaysOn = text$1('ALWAYS ON', {
         fontSize: '10px', fontWeight: '600', color: TOKEN$1('inkMuted', '#6b6560'),
         borderWidth: '1px', borderStyle: 'solid', borderColor: TOKEN$1('line', '#e6e3e1'),
         borderRadius: '999px', padding: '3px 8px',
+        width: 'auto', flexShrink: '0', // a chip hugs its word (Text defaults to 100%)
     }, createConfig);
     const necessaryCard = row(createConfig, CARD, [
         textColOf('Necessary', 'Keeps the site working: your session, your language, this very choice. Always on.'),
@@ -10169,6 +10231,7 @@ function buildConsentPreset(createConfig) {
         setTrait(sw, 'control', 'switch');
         setTrait(sw, 'name', `consent-${category}`);
         setStyleTrait(sw, 'width', 'auto');
+        setStyleTrait(sw, 'flexShrink', '0');
         return row(createConfig, CARD, [textColOf(name, desc), sw]);
     };
     const analyticsCard = categoryCard('analytics', 'Analytics', 'Anonymous counts of visits and pages. Off means the analytics script never loads.');
@@ -10185,8 +10248,11 @@ function buildConsentPreset(createConfig) {
         { type: 'grantConsent' },
         { type: 'closeDialog', target: preferences.id },
     ]), SOLID);
-    const spacer = row(createConfig, { flexGrow: '1' }, []);
-    const footer = row(createConfig, { display: 'flex', gap: '8px', alignItems: 'center' }, [prefsReject, spacer, prefsDone, prefsAccept]);
+    // No spacer Container — an EMPTY container paints the canvas "click to select" placeholder
+    // and squeezes the buttons until their labels wrap (Rule 0 catch). space-between + an end
+    // group is the same board layout with no empty node.
+    const footerEnd = row(createConfig, { display: 'flex', gap: '8px', alignItems: 'center', width: 'auto', flexShrink: '0' }, [prefsDone, prefsAccept]);
+    const footer = row(createConfig, { display: 'flex', gap: '8px', alignItems: 'center', justifyContent: 'space-between' }, [prefsReject, footerEnd]);
     if (!prefsHeading || !prefsSub || !necessaryCard || !analyticsCard || !marketingCard || !footer)
         return null;
     preferences.children = [prefsHeading, prefsSub, necessaryCard, analyticsCard, marketingCard, footer];
@@ -11163,5 +11229,5 @@ class BuilderSpacerComponentConfig extends ComponentConfig {
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION_TYPE_OPTIONS, AuditCode, AuditPanelComponent, AuditSeverity, BODY_CRUMB_LABEL, BREAKPOINT_PRESENTATION, BUILDER_CANVAS_CONTAINER, BUILDER_CHROME_EN, BackgroundGroupStyleConfig, BorderGroupStyleConfig, BreadcrumbBarComponent, BuilderButtonBlockComponent, BuilderButtonComponentConfig, BuilderClipboardService, BuilderComponent, BuilderContainerComponent, BuilderContainerComponentConfig, BuilderDataSourceService, BuilderDialogComponent, BuilderDividerComponentConfig, BuilderHeadingComponentConfig, BuilderHistoryService, BuilderIconComponentConfig, BuilderImageComponentConfig, BuilderLinkComponentConfig, BuilderLinkedContainerComponent, BuilderLinkedContainerConfig, BuilderListComponentConfig, BuilderListItemComponentConfig, BuilderMode, BuilderRepeaterComponent, BuilderSpacerComponentConfig, ButtonBlockComponentConfig, CardComponentConfig, ChildLayoutGroupStyleConfig, ComponentConfig, ComponentRegistryService, DEFAULT_ESSENTIAL_TRAITS, DRAG_HANDLE_ATTR, DataSourceRegistryService, DataSourceType, DialogComponentConfig, DimensionsGroupStyleConfig, DragEngineService, EASING_OPTIONS$1 as EASING_OPTIONS, ESSENTIAL_TRAITS_BY_TYPE, EffectsGroupStyleConfig, FIELD_PARTS, FORM_PRESETS, FORM_TYPE, FieldComponentConfig, FieldGroupComponentConfig, FormComponentConfig, FormErrorComponentConfig, FormStateService, FormSuccessComponentConfig, GalleryConfig, GroupStyleConfig, INTERACTION_STATES, INVERSE_ACTION, IOX_BUILDER_LABELS, IOX_DATA_SOURCE_ENDPOINTS, IOX_FONT_MANAGER, InteractionEngineService, InteractionPresetRegistryService, IoxBuilderModule, IoxDraggableDirective, IoxDropzoneDirective, LAYOUT_PRESETS, LayerTreeComponent, LayoutGroupStyleConfig, ListGroupStyleConfig, NodeAction, OverlayComponent, OverlayService, PanelChildComponent, PanelComponent, PanelEventService, PanelEventTypes, PanelTypes, PositionGroupStyleConfig, PresetRegistryService, RELATIONAL_STATES, RELATIONAL_STATE_BASE, ROUTE_ANIMATION_OPTIONS, RenderDirective, RepeaterComponentConfig, SCREEN_WIDTH_OPTIONS, STRUCTURAL_STATES, SUPPORTED_STATES, SectionComponent, SectionComponentConfig, SizeGroupStyleConfig, SliderContainerComponent, SliderContainerConfig, SliderSlideComponent, SliderSlideConfig, SpacingGroupStyleConfig, StyleCategory, StyleRegistryService, TraitConfig as StyleTraitConfig, SubmitButtonComponentConfig, SymbolRegistryService, TARGETED_STATES, TARGETED_STATE_BASE, TRIGGER_OPTIONS, TextBlockComponentConfig, ToolbarAction, ToolbarComponent, TraitConfig, TraitInputType, TypographyGroupStyleConfig, UNITS_ALL, UNITS_DEG, UNITS_FIXED, UNITS_NO_VW, VALIDATION_STATES, VALIDATION_STATE_CLASS, ViewportService, ZOOM_OPTIONS, arrayItemSchemaFields, arraySchemaFields, auditNodes, buildConsentPreset, buildFlavorSampler, buildFormPreset, buildFullStyleTraits, buildLayoutPreset, buildPresetStyleTraits, canFluidise, collapseColumnsProps, columnCountOf, defaultBuilderLabels, defaultPageSettings, dropTargetLabel, essentialTraitsFor, findNodeLocation, findParentOf, flattenSchemaFields, fluidiseProps, generateNodeId, isHiddenAt, matchesControlSearch, nearestFormNode, nodeAncestorPath, nodeAncestorPathInEither, reorderProps, resolveInsertTarget, resolveTraitControllerType, resolveTraitOptions, setStyleTrait, setTrait, stackChildrenProps, summarise, textNode, visibilityProps, wrapNode };
+export { ACTION_TYPE_OPTIONS, AuditCode, AuditPanelComponent, AuditSeverity, BODY_CRUMB_LABEL, BREAKPOINT_PRESENTATION, BUILDER_CANVAS_CONTAINER, BUILDER_CHROME_EN, BackgroundGroupStyleConfig, BorderGroupStyleConfig, BreadcrumbBarComponent, BuilderButtonBlockComponent, BuilderButtonComponentConfig, BuilderClipboardService, BuilderComponent, BuilderContainerComponent, BuilderContainerComponentConfig, BuilderDataSourceService, BuilderDialogComponent, BuilderDividerComponentConfig, BuilderHeadingComponentConfig, BuilderHistoryService, BuilderIconComponentConfig, BuilderImageComponentConfig, BuilderLinkComponentConfig, BuilderLinkedContainerComponent, BuilderLinkedContainerConfig, BuilderListComponentConfig, BuilderListItemComponentConfig, BuilderMode, BuilderRepeaterComponent, BuilderSpacerComponentConfig, ButtonBlockComponentConfig, CardComponentConfig, ChildLayoutGroupStyleConfig, ComponentConfig, ComponentRegistryService, DEFAULT_ESSENTIAL_TRAITS, DRAG_HANDLE_ATTR, DataSourceRegistryService, DataSourceType, DialogComponentConfig, DimensionsGroupStyleConfig, DragEngineService, EASING_OPTIONS$1 as EASING_OPTIONS, ESSENTIAL_TRAITS_BY_TYPE, EffectsGroupStyleConfig, FIELD_KIND_PRESETS, FIELD_PARTS, FORM_PRESETS, FORM_TYPE, FieldComponentConfig, FieldGroupComponentConfig, FormComponentConfig, FormErrorComponentConfig, FormStateService, FormSuccessComponentConfig, GalleryConfig, GroupStyleConfig, INTERACTION_STATES, INVERSE_ACTION, IOX_BUILDER_LABELS, IOX_DATA_SOURCE_ENDPOINTS, IOX_FONT_MANAGER, InteractionEngineService, InteractionPresetRegistryService, IoxBuilderModule, IoxDraggableDirective, IoxDropzoneDirective, LAYOUT_PRESETS, LayerTreeComponent, LayoutGroupStyleConfig, ListGroupStyleConfig, NodeAction, OverlayComponent, OverlayService, PanelChildComponent, PanelComponent, PanelEventService, PanelEventTypes, PanelTypes, PositionGroupStyleConfig, PresetRegistryService, RELATIONAL_STATES, RELATIONAL_STATE_BASE, ROUTE_ANIMATION_OPTIONS, RenderDirective, RepeaterComponentConfig, SCREEN_WIDTH_OPTIONS, STRUCTURAL_STATES, SUPPORTED_STATES, SectionComponent, SectionComponentConfig, SizeGroupStyleConfig, SliderContainerComponent, SliderContainerConfig, SliderSlideComponent, SliderSlideConfig, SpacingGroupStyleConfig, StyleCategory, StyleRegistryService, TraitConfig as StyleTraitConfig, SubmitButtonComponentConfig, SymbolRegistryService, TARGETED_STATES, TARGETED_STATE_BASE, TRIGGER_OPTIONS, TextBlockComponentConfig, ToolbarAction, ToolbarComponent, TraitConfig, TraitInputType, TypographyGroupStyleConfig, UNITS_ALL, UNITS_DEG, UNITS_FIXED, UNITS_NO_VW, VALIDATION_STATES, VALIDATION_STATE_CLASS, ViewportService, ZOOM_OPTIONS, arrayItemSchemaFields, arraySchemaFields, auditNodes, buildConsentPreset, buildFieldKindPreset, buildFlavorSampler, buildFormPreset, buildFullStyleTraits, buildLayoutPreset, buildPresetStyleTraits, canFluidise, collapseColumnsProps, columnCountOf, defaultBuilderLabels, defaultPageSettings, dropTargetLabel, essentialTraitsFor, findNodeLocation, findParentOf, flattenSchemaFields, fluidiseProps, generateNodeId, isHiddenAt, matchesControlSearch, nearestFormNode, nodeAncestorPath, nodeAncestorPathInEither, reorderProps, resolveInsertTarget, resolveTraitControllerType, resolveTraitOptions, setStyleTrait, setTrait, stackChildrenProps, summarise, textNode, visibilityProps, wrapNode };
 //# sourceMappingURL=vectoriox-iox-builder.mjs.map