Data Binding

Binding is what makes a layout a template instead of a picture. An unbound text element says "Card name" on every item. A bound one says each item's actual name. The property picker only includes the active component type's schema.

ShuffleKit states the idea plainly in the editor, behind the ⓘ How connecting works button in the Connect data panel:

Connect this to a column and every card fills it with its own value: connect a text box to Name and each card shows its own name.

Switch on Preview in the canvas header to see real card values; with preview off, elements show what you typed here.

Binding an element

1. Open Design for the active collection.
2. Select the element on the canvas or from the Layers panel.
3. Click the pill at the left end of the toolbar floating over the canvas. It reads Connect data when nothing is bound.
4. Click the field's value (Not connected) and pick a property from the list.

The panel gives you:

• A header with the ⓘ explainer and a pin that docks the panel in the right-hand panel.
• One row per bindable field: for a text element that's Text content and Text color. A connected field shows the column with a blue link icon; an unconnected one reads Not connected. A colour field nobody has connected folds into one quiet line, Connect a column +.
• A pencil button beside a connected field, which opens Rename column. The new name shows everywhere the column does, and the cards, layouts and connections that use it keep working.
• The column list, opened by clicking a field's value: the scope ("Changes all 16 cards using this layout"), Search columns, up to three Suggested columns with the reason they were suggested, All columns, a Create "…" row, and Disconnect once the field is connected.
• A sample line: what the connection puts on the card. With Preview on it is the card on the canvas; with Preview off it is the first card on this layout with a value, named. Immediate confirmation you picked the right property.
• An empty-cards line, when it applies: how many cards on this layout have no value, and what they show instead.
• Show on some cards only: a collapsed section for the element's show/hide rule, covered in Element Visibility.

The same connection can be made from the canvas right-click menu, a layer's menu in Layers, the card preview on the Data tab, or a column header. Each of those routes, and the column list's keyboard controls, are covered in Connecting Properties.

Create "…" is always at the bottom of the list. It makes a column of the right type, named after the layer or your search text, and connects it in one step, so you never have to leave the canvas.

Reading binding state at a glance

You never have to open the panel to know whether something is bound:

The Layers panel is the fastest audit. Scan the list; anything black that should be blue is a missing binding.

The dropdown is type-filtered

This surprises people, and it's a feature rather than a limitation.

Select a text element and the Text content list offers only text-compatible properties. In the example project, those are title, ability and Type. It does not offer artwork (an Image property) or powers (an Icon list). You can't accidentally bind a paragraph of rules text to an image slot. When nothing of the right type exists, the list says so ("No Image columns yet.") and still offers Create "…".

If a column's type changes after it was connected, the field keeps the connection but tags it Wrong type, with a warning ("Connected to a Text column: values may not render as expected.") and a Disconnect link. A connection to a deleted column is tagged Missing.

The corollary: if a property you expect isn't in the list, the property's type is wrong for that element. Fix it in the spreadsheet. See Properties & Columns rather than hunting for the option.

Two things people get wrong here:

Shapes are not inert. A rectangle, ellipse, line or freehand drawing carries no content, but its fill and stroke both bind, so a faction-coloured panel is one layout, not one per faction.

A colour can come from an icon column. Each icon in an Icon or Icon list cell carries a colour. Connect a colour field to that column and it paints with the icon's colour (for an Icon list, the first icon's). So one column can pick a card's icon and colour the hexagon behind it. An icon with no colour of its own leaves the element's colour as it is. Suggestions never offer an icon column for a colour field; you pick it yourself.

Icon and Icon set are different elements. An Icon set (its settings are headed Icon box) takes an Icon-list property and lays out however many symbols each card supplies. A single Icon, dropped from the icon browser, takes an Icon property and can also take a per-card tint. If a card sets its own colour on the icon cell, that cell colour wins over the tint binding. The order is cell colour → bound colour → element colour, and ShuffleKit warns you when the two actually collide.

The Text color field is described in the app as "Each card's text color from a color column, a select column's option colors, or an icon column's icon colors." Bind it to a Color property, a Select whose options carry colours, or an icon column, and the type recolours itself per card, giving you a faction-coloured title without a layout per faction. With a Select connected, the panel shows the option colours as swatches, and warns when an option has no colour of its own (those cards keep the element's colour).

Static fallback content

An unbound element shows whatever you typed into it, such as Card name or The card effect will go here …. A bound element shows it too, whenever a card has no value in the column.

That matters in three ways:

• It's what you see with preview off. Don't judge sizing by it: real names are longer.
• It can ship. A card whose cell is missing entirely falls back to the typed text and prints it. A cell that exists but is empty prints nothing. The panel's empty-cards line spells out which cards do which.
• An unbound element prints it on every card, which is almost never what you want.

A bound text box with no typed text of its own shows the column's short name in braces on cards with no value ({ability} for an Ability column), and the panel warns you. When you export, the export dialog names those cards and leaves the fields blank, unless you tick Fill them with the column name instead for a proof.

Connected text keeps one height

A text box has three Box size modes: Auto, Fit and Fixed. Connecting a text box that was on Auto switches it to Fit, and Auto stays greyed out while the box is connected. The panel says why: "Auto is off for connected text, so the box keeps one height on every card. Disconnect the column to use Auto." Fit shrinks long values until they fit the box, which is what you want when one card's rules text runs twice as long as another's.

Bold and italic in card data

A connected text box takes one style for the whole box, and word-level styling you apply in the editor doesn't reach connected text. To set part of a value apart, type the marks into the card's data:

• **Fireball:** Deal 3 damage draws Fireball: in bold.
• *Flavour text* draws it in italic, and ***both*** does both.

The stars don't print. A star that doesn't pair up, or sits between numbers as in 2*3, stays as typed, and \* always prints a star. A mark never runs past the end of a line.

The coverage notes

The old header counter is gone. Coverage now shows in two places, and each only speaks up when something needs saying.

At the top of the Layers panel, one note picks the most urgent case:

• Amber: "1 column this layout uses is no longer in your sheet: …". A connection to a column that was deleted or renamed: a broken reference, not a gap. The card still draws, and those layers show their own content.
• Strong amber: "This layout doesn't show any of your card data yet."
• Amber: "1 required property isn't on this layout: powers".
• Pale: "Showing 4 of 7 properties. Unused: …". An unbound optional property simply won't appear on the card.

See how replays a short walkthrough (not on the missing-column note), and the x dismisses the note for this layout. Under the note, one-click suggestion chips, such as number → Subtitle, bind an unused property to the layer ShuffleKit thinks it belongs on. Chips disappear as you use them.

On the spreadsheet side, a bar under the Card Details preview reports the same thing for the selected card's layout. Collapsed it reads "1 required column not connected"; expanded:

1 required column is not connected to RPG Split: powers: See how · Connect in editor →

Connect in editor → jumps to the Design tab with that layout loaded. A missing column reads "1 column no longer in your sheet" with Fix in editor →. The bar stays quiet about optional columns left off the card. The column headers repeat it per column with a small link icon: On the card, Required, and not on the card yet, Not on the card yet, or Not used by this layout.

What the notes count

Four things to internalise:

Everything in scope, not just required. Showing 4 of 7 means seven properties are relevant to this layout and four are on it. Required ones get their own, louder note because they're the ones that matter most, but optional gaps count too.

Scoped to the layout's cards. Properties whose data only exists on cards this layout never renders are left out of the total. For example, monster-only stats on a spell layout do not keep a conditional layout permanently flagged over columns it has no business showing.

Show/hide rules and layout rules both count as use. A Yes/No column that only decides whether a badge appears is in use, so it isn't flagged. A column that any layout's rule reads, such as Type, is choosing the layout, so it's left out of the count on every layout of that face, the fallback included.

Per layout, and per card on the spreadsheet side. Each layout is wired independently; adding a new required property means visiting every layout to connect it, because nothing propagates. And the spreadsheet bar reflects whichever layout the selected card resolved to, so a living card on RPG Split might report one missing column while a space card on Tarot Portrait reports two.

The notes score fronts only. A card back usually shows little or none of the card's data, so it isn't flagged. Backs can still be bound: a back connected to the card's art, name or a colour by type draws with each card's own data in exports and on the Playtable.

When "not connected" is correct

The warning isn't always a bug. A property that only drives conditions never raises it: Type decides which layout a card uses, so it doesn't need to be printed, and its column header says "Picks which layout a card uses, not on the card itself".

The case left is an internal property, such as designer notes, a balance score or a source reference. There the honest fix is to turn Required off for that property in the spreadsheet. A permanently amber note trains you to ignore it, which defeats the point. Reserve Required for properties that must reach the printed card.

Verifying with preview

Binding is only half-done until you've seen it with real data.

Turn on Preview mode and step through the cards with the arrows in the bar under the canvas, or with the ← and → keys while nothing is selected. To jump, click the card number, type another, and press Enter (Escape cancels). Preview steps through the cards that actually print on this layout. Hide unused in the same bar switches to Printed view, which drops elements whose show/hide rule fails for this card; Exit leaves Preview. Watch for:

• Overflow: the longest title in the set, not the first one.
• Empty fields: does the layout look broken, or acceptably sparse? If broken, that element wants a visibility rule.
• Wrong property: a subtitle showing rules text means a mis-picked binding. The sample line in the panel would have caught it earlier.
• Icon overflow: a card with eight power icons where you designed for three.

A reliable workflow

1. Define properties in the spreadsheet first; mark the printed ones Required.
2. Build the layout's shapes.
3. Open Layers and work top to bottom, binding each element.
4. Keep going until the coverage note in Layers goes away.
5. Turn on Preview mode and page through every card.
6. Repeat for each layout. Bindings don't carry across.

Step 6 is the one that gets skipped. A five-layout project means the work in steps 3 to 5, five times.