LogoLogo
HomepageYouTube ChannelInstall from the AppExchange
  • Home
  • Dynamic Components
  • Flow Components
  • Experience Components
  • Projects
  • 👋Welcome
  • Getting Started
    • Product Tour
    • Quickstart Tutorial
    • Understanding The Essentials
      • Component Builder
      • Component Visibility
      • Target Page Object
      • Using Variables and Component Data
      • Publishing your Dynamic Components
      • Dynamic vs. Flow Components
    • Avonni Components App
      • Accessing the App
      • Folders
      • Templates
      • Version management
    • AppExchange Listing Page
    • Installation & Licenses Management
  • Tutorials
    • Projects
    • Components
      • Calendar
        • How to Create Events Quickly by Dragging
        • How to Add an Edit Action to Calendar Events
        • How to Add a New Event Button to the Calendar Header
        • How to Customize the Right-Click Menu
        • How to Reschedule Events with Drag and Drop
      • Columns
        • Creating a Responsive 3-Column Layout
      • Data Table
        • How to customize Data Table style
        • How to make a field editable
        • How to add clickable buttons
        • How to color-code badges
        • How to export data
        • How to configure search
        • How to set columns visibility
      • Kanban
        • Saving Changes on Drag-and-Drop
      • List
      • Metric
      • Record Detail
        • Saving Changes
    • Interactions
      • How to create an interaction to navigate to an object page
      • How to create an interaction to navigate to a record page
      • How to Pass Multiple Selected Records from a Dynamic Component to a Screen Flow
    • Reactive Components
      • Reactive Map and Data Table
      • Master-Detail Relationship with Data Tables
      • Vertical Tabs with Reactive Data Table
    • Style
      • How do you add space or a break between sections or fields?
    • Tips and Tricks
      • Using the Dynamic Component component
  • Component Builder
    • Overview
    • Configuring Components
      • Properties
      • Fields
      • Style
    • Data & Interactions
      • Data Sources
        • Manual
        • Picklist
      • Resources
        • Constant
        • Formula
        • Nested Queries
        • Query
        • Variable
      • Interactions
        • CRUD from Record Variable
        • Download
        • Execute Flow
        • Navigate
        • On Load
        • Open Alert Modal
        • Open Confirm
        • Open Dynamic Component Dialog
        • Open Dynamic Component Panel
        • Open Flow Panel
        • Open Flow Dialog
        • Show Toast
    • Advanced Topics
      • Undo / Redo
      • Copy and Paste
      • Keyboard Shortcut
  • Components
    • Explore All Components
    • Accordion
    • Alert
    • Audio Player
    • Avatar
    • Avatar Group
    • Badge
    • Barcode
    • Blockquote
    • Button
    • Button Group
    • Button Icon
    • Button Menu
    • Button Stateful
    • Calendar
    • Camera 🆕
    • Card
    • Carousel
    • Chart
    • Checkbox
    • Checkbox Button
    • Chip Container
    • Color Picker
    • Columns
    • Combobox
    • Container
    • Counter
    • Data LWC Container
    • Data Table
    • Date Picker
    • Date
    • Date Range
    • Dual Listbox
    • Dynamic Component
    • Formatted Address
    • Formatted Name
    • Formatted Value
    • Header
    • Icon
    • Icon Picker
    • Illustration
    • Image
    • Input Color
    • Input Date
    • Input Pen (Signature)
    • Input Text
    • Kanban
    • List
    • LWC Container
    • Map
    • Media Object
    • Metric
    • PDF Viewer
    • Pivot Table
    • Progress Bar
    • Progress Circle
    • Progress Indicator
    • Rating
    • Record Detail
    • Relationship Graph
    • Scope Notification
    • Section
    • Separator
    • Slider
    • Status
    • Tabbed Container
    • Tabs
    • Text
    • Text Area
    • Timeline
    • Toggle
    • Tree
    • Vertical Visual Picker
    • Video Player
    • Visual Picker
    • Visual Picker Link
  • Help
    • Contact Support
    • Security
    • Performance Guide
    • Deployment Process
    • Release Notes
    • Report Bugs
Powered by GitBook
LogoLogo

Company

  • About Us
  • Pricing

Policies

  • Privacy Policy
  • Terms of Service
On this page
  • What Gets Copied?
  • Step-by-Step Guide
  • Summary

Was this helpful?

  1. Component Builder
  2. Advanced Topics

Copy and Paste

The Avonni Dynamic Component Builder includes a copy-and-paste feature that allows you to duplicate components and their configurations quickly and easily. This significantly speeds up development and ensures consistency across your components.


What Gets Copied?

When you copy a component, you're copying:

  • The Component Type: (e.g., Data Table, Button, Text, etc.)

  • All Properties: All settings in the component's Properties Panel (e.g., label, data source, visibility conditions, interactions, styling).

  • Nested Components: If the component contains nested Dynamic Components (using the Dynamic Component component), those nested components and their configurations are also copied.

  • Resources are not copied: Resources are not copied, only component configurations.


Step-by-Step Guide

  1. Select the Source Component: In the Component Builder canvas, click on the Avonni component you want to copy. This will highlight the component and display its properties in the Properties Panel.

  2. Copy the Component

    • Locate the Copy button in the top-left corner of the Component Builder canvas. It's usually represented by an icon of two overlapping squares or a similar "copy" symbol.

    • Click the Copy button. This copies the selected component and its configuration to the clipboard.

  3. Paste the Component

    • Locate the Paste button in the top-left corner of the Component Builder. It is usally represented by a clipboard icon.

    • Click the paste button. A copy of the component is added to the canvas.

  4. Place the Component

    • The new component appears

    • Click on the Move button

    • Select the new location for your component.


Important Considerations

When you copy and paste components, it's important to understand how different elements are handled:

  • Data Sources:

    • Within the Same Dynamic Component: If you copy and paste a component within the same Dynamic Component, and that component uses a Data Source (e.g., Query, Picklist), the data source configuration is copied, and the pasted component will be connected to the same data source instance. Changes to the data source in one component will affect the other.

    • Between Different Dynamic Components: If you copy a component and paste it into a different Dynamic Component, the Data Source is not copied. You will need to create a new data source manually (or select an existing, compatible one) for the target Dynamic Component and configure it appropriately.

  • Interactions:

    • Within the Same Dynamic Component: Interactions (e.g., "On Click" actions) are copied along with the component. Suppose the interaction references other components or resources within the same Dynamic Component (using their API Names). In that case, those references will generally work correctly if the referenced components/resources also exist in the pasted location. You may need to adjust references if names are not unique.

    • Between Different Dynamic Components: Interactions are copied. However, any references to other components or resources within the original Dynamic Component will likely break. You will need to manually update these references in the pasted component to point to the correct components/resources in the target Dynamic Component.

  • Resources:

    • Within the Same Dynamic Component: Resources are not automatically copied when you paste a component within the same Dynamic Component. If the pasted component relies on resources, you have to make sure those resources exist.

    • Between Different Dynamic Components: Resources are never copied between Dynamic Components. You must manually recreate any required resources (Variables, Constants, Formulas) in the target Dynamic Component.

Summary

Element
Within Same Dynamic Component
Between Different Dynamic Components

Component

Copied (including properties and nested components)

Copied (including properties and nested components)

Data Source

Configuration copied, same instance used

Not copied; must be recreated/reselected

Interactions

Copied, references may need adjustment

Copied, references likely need adjustment

Resources

Not copied; must exist.

Not copied; must be recreated

Last updated 2 months ago

Was this helpful?