html_to_flutter 0.2.2-dev.2

A convenience package for rendering HTML content as Flutter widgets.

example/lib/main.dart

import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:html_to_flutter_kit/html_to_flutter_kit.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        // This is the theme of your application.
        //
        // TRY THIS: Try running your application with "flutter run". You'll see
        // the application has a purple toolbar. Then, without quitting the app,
        // try changing the seedColor in the colorScheme below to Colors.green
        // and then invoke "hot reload" (save your changes or press the "hot
        // reload" button in a Flutter-supported IDE, or press "r" if you used
        // the command line to start the app).
        //
        // Notice that the counter didn't reset back to zero; the application
        // state is not lost during the reload. To reset the state, use hot
        // restart instead.
        //
        // This works for code too, not just values: Most code changes can be
        // tested with just a hot reload.
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  // This widget is the home page of your application. It is stateful, meaning
  // that it has a State object (defined below) that contains fields that affect
  // how it looks.

  // This class is the configuration for the state. It holds the values (in this
  // case the title) provided by the parent (in this case the App widget) and
  // used by the build method of the State. Fields in a Widget subclass are
  // always marked "final".

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Html(
        config: HtmlConfig(
          onTap: (url, [attributes, element]) {
            log('Tapped on $url');
            log('Attributes: $attributes');
            log('Element: $element');
          },
          extensions: [
            const TableExtension(),
          ],
        ),
        renderMode: RenderMode.list,
        data:
            "\n<p>In Budget 2024, the first budget in a decade presented by a coalition government, Finance Minister Nirmala Sitharaman announced several proposals that change the existing tax treatment for almost all asset classes. Top among them is the taxation on equity shares and mutual funds. Sitharaman also proposed a few tweaks to the new tax regime that will reduce tax outgo by about ₹15,000 for someone earning around ₹15 lakh per annum. Changes in buyback tax rules, a hike in the securities transaction tax (STT), a proposal to reduce stamp duty on property purchases by women, and an increased exemption limit on NPS contributions by employers are some of the other changes. Let&#8217;s look at the five big changes in this blog.</p>\n<ol>\n<li><strong>Tax on listed shares and equity mutual funds</strong></li>\n</ol>\n<p>Investors in India enjoyed tax exemption on long-term capital gains from listed shares for more than a decade after it was first introduced in 2004. This exemption was aimed to promote investing in capital markets.</p>\n<p>In 2018, Finance Minister Arun Jaitley increased the tax rate to 10%, grandfathering the profits until then for gains above ₹1 lakh.</p>\n<p>Now, in 2024, Finance Minister Nirmala Sitharaman has further enhanced the long-term capital gains tax. The tax rate has been increased to <strong>12.5%, with an exemption of up to ₹1.25 lakh per year</strong>. The short-term capital gains tax rate has also been hiked from current 15% to 20%</p>\n<p>These changes are proposed to be effective immediately, starting July 23, 2024.</p>\n<p><strong>    2. Capital gains taxation of other assets</strong></p>\n<p>The finance minister proposed to simplify the existing capital gains structure.</p>\n<p>Firstly, it is proposed that there will only be two holding periods, 12 months and 24 months, to determine whether capital gains are short-term or long-term. For all listed securities, the holding period is proposed to be 12 months, and for all other assets, it shall be 24 months. For gold, property and unlisted shares, reduction in the holding period is positive.</p>\n<p>The rate of long-term capital gains tax is proposed to be 12.5% for all categories of assets. Previously, many asset classes, including physical gold, properties, and unlisted shares, were taxed at a 20% LTCG tax rate with indexation benefit. These will now be taxed at 12.5% without any indexation.</p>\n<p>The impact of this change will vary on a case-by-case basis.</p>\n<blockquote>\n<p>Please note that on August 6, 2024, the Govt proposed to bring back indexation benefit to properties (land and building) that were acquired before July 23, 2024. For such properties, one can choose between &#8216;12.5%&#8217; or &#8216;20% with indexation&#8217; options as LTCG tax rate. </p>\n</blockquote>\n<p>For short-term gains &#8211; listed shares and bonds, on which STT was paid, will attract a 20% tax rate, while other assets will continue to be taxed at slab rates.<br />The following table summarizes the changes-</p>\n\n\n\n<figure class=\"wp-block-gallery has-nested-images columns-default is-cropped wp-block-gallery-4 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><a href=\"https://zerodha.com/z-connect/wp-content/uploads/2024/07/image-7.png\"><img loading=\"lazy\" decoding=\"async\" width=\"926\" height=\"420\" data-id=\"384705\" src=\"https://zerodha.com/z-connect/wp-content/uploads/2024/07/image-7.png\" alt=\"\" class=\"wp-image-384705\" srcset=\"https://zerodha.com/z-connect/wp-content/uploads/2024/07/image-7.png 926w, https://zerodha.com/z-connect/wp-content/uploads/2024/07/image-7-300x136.png 300w, https://zerodha.com/z-connect/wp-content/uploads/2024/07/image-7-768x348.png 768w\" sizes=\"(max-width: 926px) 100vw, 926px\" /></a></figure>\n</figure>\n\n\n\n<p>Since Budget 2023, when debt mutual funds were made taxable at slab rates—irrespective of being short-term or long-term—there has been some confusion regarding the tax treatment of gold index funds/ETFs and international funds.</p>\n\n\n\n<p>Budget 2024 announced that this provision applies only to debt funds and market-linked debentures. This is a significant positive for investors, as long-term capital gains on gold and international funds will be taxed at 12.5%. However, this new rule comes into effect from April 1, 2025.</p>\n\n\n\n<p>As per an FAQ from the Income Tax Department, these rules apply to sales made on or after July 23, 2024. The holding period for all listed assets is 12 months; for other assets, it is 24 months. Here, listed assets include Gold/silver ETFs and listed bonds as well. </p>\n\n\n\n<p>     3. <strong>Changes to buyback taxation</strong></p>\n\n\n\n<p>Previously, buybacks were tax-exempt for shareholders. Now, that has changed. Any amount you receive as consideration on the sale of shares to the company will be considered a dividend and taxed at your slab rate.</p>\n\n\n\n<p>What about the cost paid to buy the shares, initially? That can be considered a capital loss. This capital loss, as per the understanding from the memorandum, can now be offset with other capital gains. This was also explained with an illustration-</p>\n\n\n\n<p><strong>Example:</strong></p>\n\n\n\n<ul>\n<li>100 shares bought in 2020 @ ₹40 per share\n<ul>\n<li>Total cost of acquisition: ₹4,000</li>\n</ul>\n</li>\n\n\n\n<li>20 shares bought back in 2024 @ ₹60 per share\n<ul>\n<li>Income taxable as deemed dividend: ₹1,200</li>\n\n\n\n<li>Capital loss on such buyback: (₹40 * 20) = ₹800</li>\n</ul>\n</li>\n\n\n\n<li>50 shares sold in 2025 @ ₹70 per share\n<ul>\n<li>Capital Gain: (₹3,500 &#8211; ₹2,000) = ₹1,500</li>\n\n\n\n<li>Chargeable capital gain after set off of Rs 800: ₹700</li>\n</ul>\n</li>\n</ul>\n\n\n\n<p>As per a tax expert, based on the holding period of shares tendered in buyback (within 12 months or above), the capital loss will also be categorized as long-term or short-term. And the set-off and carry-forward provisions in the Income Tax Act will apply accordingly.</p>\n\n\n\n<p>These amendments will take effect from October 1, 2024.</p>\n\n\n\n<p>        4. <strong>Changes in the new tax regime</strong></p>\n\n\n\n<p>Next up is a change: the income tax slab rates. There are two key updates to the new tax regime: Firstly, the standard deduction has been increased from ₹50,000 to ₹75,000. Second, &nbsp;there have been tweaks to the tax slabs. To give a perspective on the impact, for an annual income of ₹15 lakh, your tax outlay is expected to decrease by approximately ₹10,000.</p>\n\n\n\n<p>This change, if finalized, will come into effect from FY 24-25.</p>\n\n\n\n<figure class=\"wp-block-gallery has-nested-images columns-default is-cropped wp-block-gallery-5 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><a href=\"https://zerodha.com/z-connect/wp-content/uploads/2024/07/NTR.png\"><img loading=\"lazy\" decoding=\"async\" width=\"555\" height=\"188\" data-id=\"384691\" src=\"https://zerodha.com/z-connect/wp-content/uploads/2024/07/NTR.png\" alt=\"\" class=\"wp-image-384691\" srcset=\"https://zerodha.com/z-connect/wp-content/uploads/2024/07/NTR.png 555w, https://zerodha.com/z-connect/wp-content/uploads/2024/07/NTR-300x102.png 300w\" sizes=\"(max-width: 555px) 100vw, 555px\" /></a></figure>\n</figure>\n\n\n\n<p> </p>\n<p><strong>     5. Hike in STT rate on F&amp;O</strong>Budget 2024 announced a proposal to increase the securities transaction tax (STT) on futures and options.  STT on options goes up from 0.062% to 0.1%. And STT on futures goes up from 0.0125% to 0.02% from October 1st.</p>\n<p><em>Note that all the above announcements are just proposals and will be considered final once the Finance Bill is passed.</em></p>\n\n\n\n<p>While these are the most important changes with respect to personal and investment taxation, my favourite proposals have been the focus on employment and education (mainly loans at subsidised rate of 3% for students).</p>\n",
//         data: """
//               <div>
//                 <h1>Hello, Flutter!</h1>
//                   <p>This is a sample HTML content converted to Flutter widgets.</p>
//                   <p>It supports <strong>bold</strong>, <em>italic</em>, <u>underline</u>, <strike>strike</strike> and <a href="https://aryak.dev">links</a>.</p>
//                   <p>It supports ordered and unordered lists</p>
//                   <ul>
//                     <li>Item 1</li>
//                     <li>Item 2</li>
//                     <li>Item 3</li>
//                   </ul>
//                   <br />
//                   <ol>
//                     <li>Item 1</li>
//                     <li>Item 2</li>
//                     <li>Item 3</li>
//                   </ol>
//                   <p>It supports images</p>
//                   <span><a href="https://via.assets.so/movie.png?id=1&q=95&w=100&h=100&fit=fill"><img src="https://via.assets.so/movie.png?id=1&q=95&w=100&h=100&fit=fill" height="100" /><a /><img src="https://via.assets.so/movie.png?id=2&q=95&w=100&h=100&fit=fill" height="100" /><img src="https://via.assets.so/movie.png?id=3&q=95&w=100&h=100&fit=fill" height="100" /></span>
//                   <p>It supports tables</p>
//                   <table>
//                     <thead>
//                       <tr>
//                         <th>Header 1</th>
//                         <th>Header 2</th>
//                         <th>Header 3</th>
//                       </tr>
//                     </thead>
//                     <tbody>
//                       <tr>
//                         <td>Row 1, Cell 1</td>
//                         <td>Row 1, Cell 2</td>
//                         <td>Row 1, Cell 3</td>
//                       </tr>
//                       <tr>
//                         <td>Row 2, Cell 1</td>
//                         <td>Row 2, Cell 2</td>
//                         <td>Row 2, Cell 3</td>
//                       </tr>
//                       <tr>
//                         <td>Row 3, Cell 1</td>
//                         <td>Row 3, Cell 2</td>
//                         <td>Row 3, Cell 3</td>
//                       </tr>
//                     </tbody>
//                   </table>
//                 </div>
// """,
      ),
    );
  }
}