{
	"nodes":[
		{"id":"d816c1c49f111e59","type":"text","text":"# ADDONS","x":1160,"y":-1120,"width":200,"height":80,"color":"3"},
		{"id":"f85de636ab96cf0e","type":"text","text":"# Cart line item props\n### Parent item - list of addon VIDs\n`_addon_variants`\n### Addon item - parent VID\n*indicates that the line item is an addon*\n`_addon_parent_variant`\n","x":1400,"y":-688,"width":480,"height":285},
		{"id":"8f2083d07b38c36c","type":"text","text":"## BUILDER PRODUCT PAGE","x":567,"y":-1199,"width":361,"height":73,"color":"3"},
		{"id":"a7f00a6af58050e5","type":"text","text":"# Addon metafields\n```\nvariant.metafields.store.addon_groups.value[n] (variantAddonGroups[vName][n])\n  .addon_type \n    .label (label)\n    .ui_style (uiStyle) --> \"data-ui-style\" on options parent element\n    .prop_key (key)\n  .default_variant\n    .id (defaultVid)\n  .variants[m]\n    .id ([m].id)\n    .title | ([m].title)\n    .image | img_url ([m].image)\n    .metafields.store.ship_date ([m].shipDate)\n    .metafields.store.ship_msg ([m].shipMsg)\n    .metafields.addon.swatch_colors ([m.swatchColors])\n(variantShipping)\n  .metafields.store.ship_date ([vName].shipDate)\n  .metafields.store.ship_msg ([vName].shipMsg)\n```","x":520,"y":-800,"width":730,"height":520,"color":"4"},
		{"id":"06a2cc759a160087","type":"text","text":"If Max or Darshan ever want a group of addons to be outside the right column, we could give `addon_type` a `.page_region` property. With choices like **right_column** & **under_photo**\n\nWould probably want to then introduce a similar **Product** metafield for to the \"Add to Cart\" btn.","x":1439,"y":-1485,"width":413,"height":199,"color":"5"},
		{"id":"58e006f1b6c143c7","type":"text","text":"```js:addon\\smatch\nconst addonGroupPosition = state.selectedVariantAddonGroups.findIndex(group => group.key === state.selectedVariantAddonGroupsItem.key);\n//const addonGroup = state.selectedVariantAddonGroups[addonGroupPosition];\nconst selectedAddonId = state.selectedAddons[addonGroupPosition].id;\n\nlet isChosen = state.variantsItem.id == selectedAddonId;\n//let isDefault = state.variantsItem.id == addonGroup.defaultVid;\n//let selectedAddonOffered = !!addonGroup.variants.find(variant => selectedAddonId == variant.id);\nreturn isChosen || (isDefault && !selectedAddonOffered);\n\nmyEl = document.querySelector(`[id=\"${state.selectedProductVariant.title}${state.selectedVariantAddonGroupsItem.key}${state.variantsItem.title}\"]`);\nif(!!myEl) myEl.checked = true;\n```","x":280,"y":-2075,"width":823,"height":408},
		{"id":"f550ff12be063068","type":"text","text":"## Addon onclick()\n```js\nconst addonName = state.variantsItem.title;\nconst addonGroupPosition = state.selectedVariantAddonGroupsItem.position;\nif(!state.selectedAddons) { state.selectedAddons = []; }\nstate.selectedAddons[addonGroupPosition] = state.selectedVariantAddonsItem;\nif(!!window && !!window.BigData && !!window.BigData.product) {\n  window.BigData.product.selectedAddons = [...state.selectedAddons];  \n}\n```","x":-540,"y":-2011,"width":760,"height":280},
		{"id":"d489278e69aef0a7","type":"text","text":"## Builder custom state\n```:state.\ndefaultVariantId\nproductInfo\ndummySpecs\ndummySpecMap\nspecMap\ninCart\nqtyLimit\nselectorHeader\nselectorDescription\nproductImages\nvariantsInStock\nvariantPrices\nvariantShipping --> selectedVariantShipping\nvariantData --> selectedVariantData\n    .title\n    .imageIndex\n    .subtitle\n    .infoBox\n    .infoLink\nvariantAddonGroups --> selectedVariantAddonGroups\nselectedProductVariant\nselectedImage\nselectedAddons\n```","x":-645,"y":-1667,"width":820,"height":618,"color":"6"},
		{"id":"6e2e1e777804cc5f","type":"text","text":"## Builder JS\n```:BigData.product.variantAddonGroups\n.[variantName]\n  [n]\n    .header\n    .description\n    .uiStyle\n    .key\n    .toggleable\n    .checkedVariantIds[]\n    .disabledVariantIds[]\n    .ephemeralVariantIds[]\n    .variants\n      [m]\n        .id\n        .image\n        .imageIndex\n        .title\n        .description\n        .price\n        .priceText[]\n        .swatchColors\n        .finePrint\n        .finePrintIndex*\n        .shipDate\n        .shipMsg\n        .shipsSeparately\n        .linkedVariantIds[]\n```\n\n```:BigData.product.variantShipping\n.[variantName]\n  .shipDate\n  .shipMsg\n```","x":-665,"y":-685,"width":820,"height":788,"color":"4"}
	],
	"edges":[
		{"id":"c5e6656e3b475f64","fromNode":"d816c1c49f111e59","fromSide":"bottom","toNode":"a7f00a6af58050e5","toSide":"top"},
		{"id":"4106565b83d25775","fromNode":"d816c1c49f111e59","fromSide":"bottom","toNode":"f85de636ab96cf0e","toSide":"top"},
		{"id":"4ac91a1e3d8ddaf8","fromNode":"d816c1c49f111e59","fromSide":"left","toNode":"8f2083d07b38c36c","toSide":"right"},
		{"id":"2072099aae6fd2ee","fromNode":"a7f00a6af58050e5","fromSide":"left","toNode":"6e2e1e777804cc5f","toSide":"right"},
		{"id":"f40510b3efc261e7","fromNode":"8f2083d07b38c36c","fromSide":"left","toNode":"6e2e1e777804cc5f","toSide":"right"},
		{"id":"4d929b57d9c97a88","fromNode":"d816c1c49f111e59","fromSide":"right","toNode":"06a2cc759a160087","toSide":"left","toEnd":"none"},
		{"id":"18ec36ef8d2e5785","fromNode":"8f2083d07b38c36c","fromSide":"top","toNode":"58e006f1b6c143c7","toSide":"bottom"},
		{"id":"8e6a001f74ad76a1","fromNode":"58e006f1b6c143c7","fromSide":"left","toNode":"f550ff12be063068","toSide":"right","toEnd":"none"},
		{"id":"68fbba227cde46c3","fromNode":"6e2e1e777804cc5f","fromSide":"top","toNode":"d489278e69aef0a7","toSide":"bottom","color":"4"}
	]
}