---
schema_version: "1"
id: ec6e949d5a6fd36c14ad2f81b71e920c899b3cccb1b85633afe978ffec76ba1e
title: Flexcards Custom LWC Properties (Managed Package)
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/xcloud/264-0-0/os_flexcards_custom_lwc_properties.md
canonical_url: https://help.salesforce.com/s/articleView?id=xcloud.os_flexcards_custom_lwc_properties.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: 3ba1fd24e5b624b7ebe43370271647cb75cea09e2d41d2e8b389000cfc073fde
description: For the managed package runtime, custom LWC element properties are configurable in the Property Panel when you select a Custom LWC element in the Flexcard Designer. With Custom LWC element, embed an LWC Omniscript, a generated Flexcard LWC, or a custom LWC, inside a Flexcard state.
products:
  - Omnistudio
release: "264"
---
# Flexcards Custom LWC Properties (Managed Package)

For the managed package runtime, custom LWC element properties are configurable in the Property Panel when you select a Custom LWC element in the Flexcard Designer. With Custom LWC element, embed an LWC Omniscript, a generated Flexcard LWC, or a custom LWC, inside a Flexcard state.

![Managed Package app icon](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-xcloud-omnistudio_for_managed_packages-264-0-0-production-enus/aa2554ec-624a-4ee6-8da4-6435670e6e62/resources-global/_corporate/images/managedpackageicon.png) This information is for Omnistudio for Managed Packages. For Omnistudio on standard runtime, see [Omnistudio Help](https://help.salesforce.com/s/articleView?id=xcloud.os_omnistudio_standard.htm&language=en_US).

See [Embed a Custom Lightning Web Component, a Flexcard, or an Omniscript in a Flexcard (Managed Package)](https://help.salesforce.com/s/articleView?id=xcloud.os_embed_a_custom_lwc_inside_a_flexcard.htm&release=264.0.0&type=5 "For the managed package runtime, embed a custom LWC, a child Flexcard, or an Omniscript in a Flexcard, and add custom styling and functionality. For example, if you have a carousel component, you can embed it in a Flexcard and then configure its attributes.").

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small ">
        <colgroup>
          <col>
          <col>
          <col>
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d240235e58">
              <p style="margin-bottom:0;">Property</p>
            </th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d240235e64">
              <p style="margin-bottom:0;">Description</p>
            </th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d240235e70">
              <p style="margin-bottom:0;">Reference</p>
            </th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="Property" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e58 ">
              <p style="margin-bottom:0;">Attribute</p>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e64 ">
              <p style="margin-bottom:0;">Enter the name of the attribute defined in the selected custom LWC.</p>
            </td>

            <td data-label="Reference" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e70 ">
              <p style="margin-bottom:0;">n/a</p>
            </td>

          </tr>
          <tr class="">
            <td data-label="Property" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e58 ">
              <p style="margin-bottom:0;">Conditions</p>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e64 ">
              <p style="margin-bottom:0;">Add a condition that must be met for the element to display.</p>
            </td>

            <td data-label="Reference" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e70 ">

            </td>

          </tr>
          <tr class="">
            <td data-label="Property" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e58 ">
              <p style="margin-bottom:0;">Custom LWC Name</p>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e64 ">
              <p style="margin-bottom:0;">Select the custom LWC to embed.</p>
            </td>

            <td data-label="Reference" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e70 ">
              <p style="margin-bottom:0;">n/a</p>
            </td>

          </tr>
          <tr class="">
            <td data-label="Property" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e58 ">
              <p style="margin-bottom:0;">Element Name</p>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e64 ">
              <p style="margin-bottom:0;">The name of the element as seen on the canvas. Used to distinguish one element from another as you build your Flexcard in the designer. Is used only within the designer.</p>
            </td>

            <td data-label="Reference" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e70 ">

            </td>

          </tr>
          <tr class="">
            <td data-label="Property" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e58 ">
              <p style="margin-bottom:0;">Value</p>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e64 ">
              <p style="margin-bottom:0;">Enter the value of the <strong class="uicontrol">Attribute</strong>.</p>
            </td>

            <td data-label="Reference" class="slds-cell-wrap" style="vertical-align:top;" headers="d240235e70 ">
              <p style="margin-bottom:0;">n/a</p>
            </td>

          </tr>
        </tbody>
      </table>