@vectoriox/iox-builder 7.0.0 → 7.0.1

package/fesm2022/vectoriox-iox-builder.mjs

@@ -10667,8 +10667,16 @@ function button(styleId, label, createConfig, styles = {}) {
     styled(btn, styles);
     return withChildren(btn, [text(label, createConfig, undefined, { color: 'inherit' })]);
 }
+/** A Container sized by its content: the palette Container's 200px drop-zone min-height is canvas
+ *  furniture, and a specimen has no drop zone. */
+function box(createConfig, styleId) {
+    const node = createConfig('Container');
+    if (styleId)
+        wearing(node, styleId);
+    return styled(node, { minHeight: '0' });
+}
 function boxed(styleId, createConfig, children, styles) {
-    return withChildren(styled(wearing(createConfig('Container'), styleId), styles), children);
+    return withChildren(styled(box(createConfig, styleId), styles), children);
 }
 /**
  * The specimen for one element style (Board 6, Element styles tab). Null for an unknown id or a
@@ -10749,8 +10757,8 @@ function layoutSpecimen(id, createConfig, copy) {
  * so the tile wears whichever look's tokens its wrapper declares.
  */
 function buildFlavorSpecimen(name, createConfig, copy) {
-    const dots = styled(createConfig('Container'), { display: 'flex', gap: '4px', alignSelf: 'start', width: 'auto' });
-    const dotNodes = TILE_DOTS.map(token => styled(createConfig('Container'), {
+    const dots = styled(box(createConfig), { display: 'flex', gap: '4px', alignSelf: 'start', width: 'auto' });
+    const dotNodes = TILE_DOTS.map(token => styled(box(createConfig), {
         width: '14px', height: '14px', borderRadius: '50%', backgroundColor: `var(--iox-${token})`,
         borderWidth: '1px', borderStyle: 'solid', borderColor: 'rgba(127, 127, 127, 0.25)', flexShrink: '0',
     }));
@@ -10764,7 +10772,7 @@ function buildFlavorSpecimen(name, createConfig, copy) {
         gridColumn: '1 / -1', display: 'flex', alignItems: 'center', justifyContent: 'space-between',
         gap: '10px', padding: '7px 9px', width: 'auto',
     });
-    const root = styled(createConfig('Container'), {
+    const root = styled(box(createConfig), {
         display: 'grid', gridTemplateColumns: '1fr auto', gap: '6px', alignContent: 'space-between',
         height: '96px', padding: '10px', width: '100%',
     });