Property Toggle

<p><strong>Property Toggle</strong> lets you quickly set boolean (true/false) properties on component instances in bulk. Great for managing design systems and quickly making variations of layouts when your components have shared properties.</p><p><br></p><h2>Usage</h2><ul><li><strong>Add properties</strong> that you want to toggle (ex. “dark mode”)</li><li><strong>Toggle properties</strong> to the state you want to set</li><li><strong>Apply changes</strong> to the entire page, or your current selection</li></ul><p><br></p><h2>Examples</h2><ul><li>Add a <code><strong>notch</strong></code> property and variants to your components and use Property Toggle to quickly swap between iPhone 13 and iPhone SE layouts</li><li>Add a <code><strong>dark mode</strong></code> property and variants to your components and use Property Toggle to quickly see what your layout will look like for users who use different preferences</li><li>Add an <code><strong>android</strong></code> property and variants to your components and use Property Toggle to quickly switch out platform-specific UI patterns to make your devs happy</li><li>Add an <code><strong>accessibility mode</strong></code> property and variants to your components and use Property Toggle to quickly test what larger font sizes and higher contrast colours would look like in your layout</li><li>When building design ‘molecules’ in your design system from design ‘atoms’ with shared properties, quickly create variants by switching all nested instances at the same time.</li></ul>