<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: CodePlusDev</title>
    <description>The latest articles on DEV Community by CodePlusDev (@codeplusdev).</description>
    <link>https://dev.to/codeplusdev</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F190614%2F9036e681-f21d-44a3-8601-558f79302075.png</url>
      <title>DEV Community: CodePlusDev</title>
      <link>https://dev.to/codeplusdev</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/codeplusdev"/>
    <language>en</language>
    <item>
      <title>Unlocking the Power of Dynamic Pricing in WooCommerce</title>
      <dc:creator>CodePlusDev</dc:creator>
      <pubDate>Thu, 14 Sep 2023 01:40:14 +0000</pubDate>
      <link>https://dev.to/codeplusdev/unlocking-the-power-of-dynamic-pricing-in-woocommerce-3dbl</link>
      <guid>https://dev.to/codeplusdev/unlocking-the-power-of-dynamic-pricing-in-woocommerce-3dbl</guid>
      <description>&lt;p&gt;E-commerce has revolutionized the way we shop, and with platforms like WooCommerce, setting up an online store has never been easier. However, to truly stand out and maximize sales, one must leverage advanced strategies. One such strategy is dynamic pricing. Let's dive into what it is and how you can harness its power using the WooCommerce Dynamic Price Manager.&lt;/p&gt;

&lt;h2&gt;
  
  
  What is Dynamic Pricing?
&lt;/h2&gt;

&lt;p&gt;Dynamic pricing is a strategy where prices change based on predefined conditions. This could be in response to market demand, inventory levels, customer behavior, or other external factors. For instance, you might offer discounts to repeat visitors or during off-peak hours to boost sales.&lt;/p&gt;

&lt;h2&gt;
  
  
  Benefits of Dynamic Pricing:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Increase Sales&lt;/strong&gt;: Attract new customers and incentivize existing ones to buy more.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Boost Profits&lt;/strong&gt;: Maximize revenue by setting optimal prices.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Target Specific Segments&lt;/strong&gt;: Offer tailored prices to different customer groups.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Enhance Customer Loyalty&lt;/strong&gt;: Reward loyal customers with special discounts.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Introducing the WooCommerce Dynamic Price Manager
&lt;/h2&gt;

&lt;p&gt;This plugin, available on &lt;a href="https://codecanyon.net/item/woocommerce-dynamic-price-manager/31347410"&gt;CodeCanyon&lt;/a&gt;, allows you to easily implement dynamic pricing on your WooCommerce store. Here's what it offers:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Dynamic Pricing Rules&lt;/strong&gt;: Set conditions based on roles, location, spending, and more.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Flash Sales&lt;/strong&gt;: Launch time-sensitive discounts.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Geo-Targeted Offers&lt;/strong&gt;: Discounts based on a customer's location.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Product Bundles&lt;/strong&gt;: Special prices for bundled items.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Loyalty Tiers&lt;/strong&gt;: Offer incremental discounts to repeat customers.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;For a deeper dive into its features, check out this &lt;a href="https://codeplus.dev/dynamic-pricing-for-woocommerce/"&gt;detailed guide&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  How to Implement Dynamic Pricing with the Plugin
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Install and Activate&lt;/strong&gt;: Purchase the plugin from CodeCanyon and install it on your WooCommerce store.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Set Pricing Rules&lt;/strong&gt;: Define conditions like user roles, total spent, or geographic location.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Choose Discount Types&lt;/strong&gt;: Decide whether you want a percentage off, a flat discount, or a fixed price.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Monitor and Adjust&lt;/strong&gt;: Regularly review the performance of your pricing rules and adjust as necessary.&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;Dynamic pricing is a game-changer in the e-commerce world. With the WooCommerce Dynamic Price Manager, implementing this strategy is a breeze. Whether you're looking to boost sales, increase profits, or enhance customer loyalty, dynamic pricing can help you achieve your goals.&lt;/p&gt;

</description>
      <category>woocommerce</category>
      <category>wordpress</category>
      <category>webmonetization</category>
      <category>news</category>
    </item>
    <item>
      <title>What Is Dynamic Pricing? Why Should It Be Implemented?</title>
      <dc:creator>CodePlusDev</dc:creator>
      <pubDate>Sat, 19 Aug 2023 21:27:17 +0000</pubDate>
      <link>https://dev.to/codeplusdev/what-is-dynamic-pricing-why-should-it-be-implemented-125m</link>
      <guid>https://dev.to/codeplusdev/what-is-dynamic-pricing-why-should-it-be-implemented-125m</guid>
      <description>&lt;p&gt;Dynamic pricing, also known as demand pricing or time-based pricing, is a transformative pricing strategy where businesses set flexible prices for products or services based on current market demand. But what exactly does it entail, and why should it be implemented in your business? Let’s dive in.&lt;/p&gt;

&lt;h2&gt;
  
  
  What Is Dynamic Pricing?
&lt;/h2&gt;

&lt;p&gt;Dynamic pricing is the ever-evolving practice of adjusting prices on the fly in response to real-time supply and demand. It’s more prevalent than ever, with industries like airlines, hotels, and online retailers becoming common users of this pricing approach.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--l5EG-gd1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://codeplus.dev/wp-content/uploads/2023/08/shocked-male-retailer-find-out-of-profit-results-or-career-opportunities-while-working-in-store--1024x683.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--l5EG-gd1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://codeplus.dev/wp-content/uploads/2023/08/shocked-male-retailer-find-out-of-profit-results-or-career-opportunities-while-working-in-store--1024x683.jpg" alt="Shocked male retailer find out of profit results or career opportunities, while working in store." width="800" height="534"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  How Does Dynamic Pricing Work?
&lt;/h3&gt;

&lt;p&gt;It’s a multifaceted process involving:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Real-Time Analysis&lt;/strong&gt; : Algorithms analyze market conditions, competitor prices, and other external factors.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Price Adjustment&lt;/strong&gt; : Prices are adjusted to match current demand.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Continuous Monitoring&lt;/strong&gt; : Constant monitoring ensures the price is always right.&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Why Should Dynamic Pricing Be Implemented?
&lt;/h2&gt;

&lt;p&gt;The importance of dynamic pricing goes beyond simple price adjustments. Here’s why it should be an integral part of your business strategy:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Maximize Profits&lt;/strong&gt; : Increase revenue during peak times.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Competitive Advantage&lt;/strong&gt; : React to market changes faster than competitors.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Customer Segmentation&lt;/strong&gt; : Offer targeted pricing to different customer groups.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Inventory Management&lt;/strong&gt; : Manage inventory by incentivizing purchases when supply is high.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--hFq71M3J--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://codeplus.dev/wp-content/uploads/2023/08/3d-illustration-of-a-bunch-of-euros-in-someone-s-hand-in-the-background-1024x682.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--hFq71M3J--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://codeplus.dev/wp-content/uploads/2023/08/3d-illustration-of-a-bunch-of-euros-in-someone-s-hand-in-the-background-1024x682.jpg" alt="3d illustration of a bunch of euros in someone's hand in the background" width="800" height="533"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The Evolution of Dynamic Pricing
&lt;/h2&gt;

&lt;p&gt;Dynamic pricing isn’t a new concept; it’s been around for decades. However, advancements in technology have allowed it to become more sophisticated and accessible to businesses of all sizes. Big data, machine learning, and artificial intelligence now play crucial roles in fine-tuning this pricing strategy.&lt;/p&gt;

&lt;h2&gt;
  
  
  Challenges and Ethical Considerations
&lt;/h2&gt;

&lt;p&gt;While dynamic pricing offers numerous advantages, it’s not without challenges. Consideration must be given to ethical implications, customer perceptions, and the potential for price discrimination. Proper implementation requires a deep understanding of both market dynamics and the legal landscape.&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;Dynamic pricing is more than a pricing model; it’s a powerful tool for businesses looking to stay competitive in today’s fast-paced market. Its implementation requires careful planning and consideration of market trends, customer needs, ethical considerations, and more. When executed correctly, it can lead to increased profitability and a more robust business model. Embrace the future of pricing with dynamic pricing!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://codeplus.dev/dynamic-pricing-for-woocommerce/"&gt;Unlock the Power of Dynamic Pricing Today!&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--h5vqZZ2n--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://codeplus.dev/wp-content/uploads/2023/08/group-of-successful-happy-business-people-in-office-celebrating-profits-1024x682.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--h5vqZZ2n--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://codeplus.dev/wp-content/uploads/2023/08/group-of-successful-happy-business-people-in-office-celebrating-profits-1024x682.jpg" alt="Group of successful happy business people in office celebrating profits" width="800" height="533"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>marketing</category>
      <category>demandpricing</category>
      <category>dynamicpricing</category>
      <category>pricingstrategy</category>
    </item>
    <item>
      <title>How to Create Modals on PrimeReact</title>
      <dc:creator>CodePlusDev</dc:creator>
      <pubDate>Thu, 20 Oct 2022 04:20:45 +0000</pubDate>
      <link>https://dev.to/codeplusdev/how-to-create-modals-on-primereact-4jle</link>
      <guid>https://dev.to/codeplusdev/how-to-create-modals-on-primereact-4jle</guid>
      <description>&lt;p&gt;IzyModals is a Wizard library that creats React Modals using PrimeReact component. I will show you how to create a modal using izymodals in this post.&lt;/p&gt;

&lt;h2&gt;
  
  
  GET STARTED: INSTALLATION
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm i izymodals
&lt;span class="c"&gt;# or&lt;/span&gt;
yarn add izymodals
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  LINKS
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://codeplus.dev/projects/izymodals"&gt;CodePlusDev&lt;/a&gt;&lt;br&gt;
&lt;a href="https://www.npmjs.com/package/izymodals"&gt;NPMJS&lt;/a&gt;&lt;br&gt;
&lt;a href="https://yarnpkg.com/package/izymodals"&gt;YARNPKG&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  CodeSandbox Live Examples
&lt;/h2&gt;

&lt;p&gt;&lt;iframe src="https://codesandbox.io/embed/2iz6t1"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Example configs for creating TabModal&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;TabModal&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;izymodals&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;steps&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;label&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Step 1&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;content&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;Container&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;params&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="na"&gt;children&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;PromptExample&lt;/span&gt; &lt;span class="nx"&gt;buttonLabel&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Step 1 Button: Do you like it?&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;/&amp;gt;&lt;/span&gt;
      &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="na"&gt;label&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Step 2&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;content&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;Container&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;params&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="na"&gt;children&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;
          &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;PromptExample&lt;/span&gt; &lt;span class="nx"&gt;buttonLabel&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Step 2: Do you recommend it to your friend?&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;/&amp;gt;&lt;/span&gt;
        &lt;span class="p"&gt;)&lt;/span&gt;
      &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="p"&gt;];&lt;/span&gt;

&lt;span class="k"&gt;return &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;TabModal&lt;/span&gt; &lt;span class="nx"&gt;status&lt;/span&gt; &lt;span class="nx"&gt;steps&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;steps&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
      &lt;span class="p"&gt;{({&lt;/span&gt; &lt;span class="nx"&gt;tabList&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;tabPanels&lt;/span&gt; &lt;span class="p"&gt;})&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;return &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
          &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt; &lt;span class="nx"&gt;className&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;col-12 flex&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
            &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt; &lt;span class="nx"&gt;className&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;col-2&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
              &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt; &lt;span class="nx"&gt;className&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;card&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
                &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt; &lt;span class="nx"&gt;className&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;flex align-items-center flex-column &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
                  &lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;tabList&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;
                &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;              &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;            &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;            &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt; &lt;span class="nx"&gt;className&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;col-10&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
              &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt; &lt;span class="nx"&gt;className&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;flex flex-column&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;tabPanels&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;            &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;          &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;        &lt;span class="p"&gt;);&lt;/span&gt;
      &lt;span class="p"&gt;}}&lt;/span&gt;
    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/TabModal&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;  &lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;"tabPanels" and "tabList" variables are placeholders for PrimeReact Tabs component. "tabList" replaces with tab menu, tabPanels replaces with tab contents. TabModal component's child must start with a arrow function such as the example. So, do not forget to import TabModal component.&lt;/p&gt;

&lt;h2&gt;
  
  
  Prompt Modal Example File
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;useState&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;react&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;PromptModal&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;izymodals&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;PropmtExample&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;props&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;status&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;setStatus&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useState&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kc"&gt;false&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

  &lt;span class="k"&gt;return &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;PromptModal&lt;/span&gt;
        &lt;span class="nx"&gt;status&lt;/span&gt;
        &lt;span class="nx"&gt;labelYes&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;yes&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
        &lt;span class="nx"&gt;labelNo&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;no&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
        &lt;span class="nx"&gt;onYes&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nf"&gt;setStatus&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;yes&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)}&lt;/span&gt;
        &lt;span class="nx"&gt;onNo&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="p"&gt;{()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nf"&gt;setStatus&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;no&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)}&lt;/span&gt;
        &lt;span class="p"&gt;{...&lt;/span&gt;&lt;span class="nx"&gt;props&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;
      &lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="nx"&gt;Test&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;status&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;
      &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/PromptModal&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;    &lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/div&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;  &lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="k"&gt;default&lt;/span&gt; &lt;span class="nx"&gt;PropmtExample&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Support me for my Open Source Projects&lt;/strong&gt;&lt;br&gt;
&lt;a href="https://github.com/uuur86"&gt;https://github.com/uuur86&lt;/a&gt;&lt;br&gt;
&lt;a href="https://github.com/sponsors/uuur86"&gt;https://github.com/sponsors/uuur86&lt;/a&gt;&lt;/p&gt;

</description>
      <category>codesandbox</category>
    </item>
  </channel>
</rss>
