ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

Material​Ui React Component Snippet Autocomplete

by Pushpam Kumar ALL

Materialui React Component Snippet and Autocomplete for Sublime Text

Details

Installs

  • Total 1K
  • Win 921
  • Mac 203
  • Linux 301
Sep 29 Sep 28 Sep 27 Sep 26 Sep 25 Sep 24 Sep 23 Sep 22 Sep 21 Sep 20 Sep 19 Sep 18 Sep 17 Sep 16 Sep 15 Sep 14 Sep 13 Sep 12 Sep 11 Sep 10 Sep 9 Sep 8 Sep 7 Sep 6 Sep 5 Sep 4 Sep 3 Sep 2 Sep 1 Aug 31 Aug 30 Aug 29 Aug 28 Aug 27 Aug 26 Aug 25 Aug 24 Aug 23 Aug 22 Aug 21 Aug 20 Aug 19 Aug 18 Aug 17 Aug 16 Aug 15
Windows 4 1 3 3 3 1 3 0 4 6 2 3 1 1 1 3 2 2 2 10 0 1 2 2 2 1 2 3 4 1 2 1 1 2 3 4 4 3 4 2 0 4 3 1 1 2
Mac 0 0 0 1 1 0 1 0 1 0 0 0 3 0 0 1 0 0 0 0 1 2 0 0 0 0 1 0 0 0 0 0 2 2 1 1 1 0 0 0 0 0 0 1 1 0
Linux 0 0 1 2 1 0 1 2 2 1 0 1 0 2 0 0 0 1 0 0 0 2 0 0 1 1 1 0 1 1 1 0 0 2 0 1 2 0 0 0 0 2 0 1 1 1

Readme

Source
github.​com

<!DOCTYPE html>

materialui-react-component-snippet-autocomplete/README.md at master · Pushpamk/materialui-react-component-snippet-autocomplete · GitHub
<meta name="twitter:image:src" content="https://avatars3.githubusercontent.com/u/25183920?s=400&amp;v=4" /><meta name="twitter:site" content="@github" /><meta name="twitter:card" content="summary" /><meta name="twitter:title" content="Pushpamk/materialui-react-component-snippet-autocomplete" /><meta name="twitter:description" content="Materialui React Component Snippet and Autocomplete for Sublime Text - Pushpamk/materialui-react-component-snippet-autocomplete" />
<meta property="og:image" content="https://avatars3.githubusercontent.com/u/25183920?s=400&amp;v=4" /><meta property="og:site_name" content="GitHub" /><meta property="og:type" content="object" /><meta property="og:title" content="Pushpamk/materialui-react-component-snippet-autocomplete" /><meta property="og:url" content="https://github.com/Pushpamk/materialui-react-component-snippet-autocomplete" /><meta property="og:description" content="Materialui React Component Snippet and Autocomplete for Sublime Text - Pushpamk/materialui-react-component-snippet-autocomplete" />

<meta name="hovercard-subject-tag" content="repository:190377524" data-pjax-transient>

<meta name="google-site-verification" content="c1kuD-K2HIVF635lypcsWPoD4kilo5-jA_wBFyT4uMY">

<meta name="google-analytics" content="UA-3769691-2">

<meta name="hostname" content="github.com">
<meta name="user-login" content="">


  <meta name="expected-hostname" content="github.com">


<meta name="enabled-features" content="MARKETPLACE_PENDING_INSTALLATIONS">

<link href="https://github.com/Pushpamk/materialui-react-component-snippet-autocomplete/commits/master.atom" rel="alternate" title="Recent Commits to materialui-react-component-snippet-autocomplete:master" type="application/atom+xml">

<link rel="canonical" href="https://github.com/Pushpamk/materialui-react-component-snippet-autocomplete/blob/master/README.md" data-pjax-transient>

<div class="position-relative js-header-wrapper ">
  <a href="#start-of-content" class="px-2 py-4 bg-blue text-white show-on-focus js-skip-to-content">Skip to content</a>
  <span class="progress-pjax-loader width-full js-pjax-loader-bar Progress position-fixed">
<span style="background-color: #79b8ff;width: 0%;" class="Progress-item progress-pjax-loader-bar "></span>

<header class="Header-old header-logged-out js-details-container Details position-relative f4 py-2" role="banner">

<div class="d-lg-none css-truncate css-truncate-target width-fit p-2">


      </div>

    <div class="d-flex flex-items-center">
          <a href="/join?ref_cta=Sign+up&amp;ref_loc=header+logged+out&amp;ref_page=%2F%3Cuser-name%3E%2F%3Crepo-name%3E%2Fblob%2Fshow&amp;source=header-repo"
            class="d-inline-block d-lg-none f5 text-white no-underline border border-gray-dark rounded-2 px-2 py-1 mr-3 mr-sm-5"
            data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;site header&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;SIGN_UP&quot;,&quot;originating_url&quot;:&quot;https://github.com/Pushpamk/materialui-react-component-snippet-autocomplete/blob/master/README.md&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="5878b68e45a13103ff8ff4320c0c5d6dff1a4c5e4957e24637cbf60b3d853d39"
            data-ga-click="Sign up, click to sign up for account, ref_page:/&lt;user-name&gt;/&lt;repo-name&gt;/blob/show;ref_cta:Sign up;ref_loc:header logged out">
            Sign&nbsp;up
          </a>

      <button class="btn-link d-lg-none mt-1 js-details-target" type="button" aria-label="Toggle navigation" aria-expanded="false">
        <svg height="24" class="octicon octicon-three-bars text-white" viewBox="0 0 16 16" version="1.1" width="24" aria-hidden="true"><path fill-rule="evenodd" d="M1 2.75A.75.75 0 011.75 2h12.5a.75.75 0 110 1.5H1.75A.75.75 0 011 2.75zm0 5A.75.75 0 011.75 7h12.5a.75.75 0 110 1.5H1.75A.75.75 0 011 7.75zM1.75 12a.75.75 0 100 1.5h12.5a.75.75 0 100-1.5H1.75z"></path></svg>
      </button>
    </div>
</div>

<div class="HeaderMenu HeaderMenu--logged-out position-fixed top-0 right-0 bottom-0 height-fit position-lg-relative d-lg-flex flex-justify-between flex-items-center flex-auto">
  <div class="d-flex d-lg-none flex-justify-end border-bottom bg-gray-light p-3">
    <button class="btn-link js-details-target" type="button" aria-label="Toggle navigation" aria-expanded="false">
      <svg height="24" class="octicon octicon-x text-gray" viewBox="0 0 24 24" version="1.1" width="24" aria-hidden="true"><path fill-rule="evenodd" d="M5.72 5.72a.75.75 0 011.06 0L12 10.94l5.22-5.22a.75.75 0 111.06 1.06L13.06 12l5.22 5.22a.75.75 0 11-1.06 1.06L12 13.06l-5.22 5.22a.75.75 0 01-1.06-1.06L10.94 12 5.72 6.78a.75.75 0 010-1.06z"></path></svg>
    </button>
  </div>

    <nav class="mt-0 px-3 px-lg-0 mb-5 mb-lg-0" aria-label="Global">
      <ul class="d-lg-flex list-style-none">
          <li class="d-block d-lg-flex flex-lg-nowrap flex-lg-items-center border-bottom border-lg-bottom-0 mr-0 mr-lg-3 edge-item-fix position-relative flex-wrap flex-justify-between d-flex flex-items-center ">
            <details class="HeaderMenu-details details-overlay details-reset width-full">
              <summary class="HeaderMenu-summary HeaderMenu-link px-0 py-3 border-0 no-wrap d-block d-lg-inline-block">
                Why GitHub?
                <svg x="0px" y="0px" viewBox="0 0 14 8" xml:space="preserve" fill="none" class="icon-chevon-down-mktg position-absolute position-lg-relative">
                  <path d="M1,1l6.2,6L13,1"></path>
                </svg>
              </summary>
              <div class="dropdown-menu flex-auto rounded-1 bg-white px-0 mt-0 pb-4 p-lg-4 position-relative position-lg-absolute left-0 left-lg-n4">
                <a href="/features" class="py-2 lh-condensed-ultra d-block link-gray-dark no-underline h5 Bump-link--hover" data-ga-click="(Logged out) Header, go to Features">Features <span class="Bump-link-symbol float-right text-normal text-gray-light">&rarr;</span></a>
                <ul class="list-style-none f5 pb-3">
                  <li class="edge-item-fix"><a href="/features/code-review/" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Code review">Code review</a></li>
                  <li class="edge-item-fix"><a href="/features/project-management/" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Project management">Project management</a></li>
                  <li class="edge-item-fix"><a href="/features/integrations" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Integrations">Integrations</a></li>
                  <li class="edge-item-fix"><a href="/features/actions" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Actions">Actions</a></li>
                  <li class="edge-item-fix"><a href="/features/packages" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to GitHub Packages">Packages</a></li>
                  <li class="edge-item-fix"><a href="/features/security" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Security">Security</a></li>
                  <li class="edge-item-fix"><a href="/features#team-management" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Team management">Team management</a></li>
                  <li class="edge-item-fix"><a href="/features#hosting" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Code hosting">Hosting</a></li>
                  <li class="edge-item-fix hide-xl"><a href="/mobile" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Mobile">Mobile</a></li>
                </ul>

                <ul class="list-style-none mb-0 border-lg-top pt-lg-3">
                  <li class="edge-item-fix"><a href="/customer-stories" class="py-2 lh-condensed-ultra d-block no-underline link-gray-dark no-underline h5 Bump-link--hover" data-ga-click="(Logged out) Header, go to Customer stories">Customer stories <span class="Bump-link-symbol float-right text-normal text-gray-light">&rarr;</span></a></li>
                  <li class="edge-item-fix"><a href="/security" class="py-2 lh-condensed-ultra d-block no-underline link-gray-dark no-underline h5 Bump-link--hover" data-ga-click="(Logged out) Header, go to Security">Security <span class="Bump-link-symbol float-right text-normal text-gray-light">&rarr;</span></a></li>
                </ul>
              </div>
            </details>
          </li>
          <li class="border-bottom border-lg-bottom-0 mr-0 mr-lg-3">
            <a href="/team" class="HeaderMenu-link no-underline py-3 d-block d-lg-inline-block" data-ga-click="(Logged out) Header, go to Team">Team</a>
          </li>
          <li class="border-bottom border-lg-bottom-0 mr-0 mr-lg-3">
            <a href="/enterprise" class="HeaderMenu-link no-underline py-3 d-block d-lg-inline-block" data-ga-click="(Logged out) Header, go to Enterprise">Enterprise</a>
          </li>

          <li class="d-block d-lg-flex flex-lg-nowrap flex-lg-items-center border-bottom border-lg-bottom-0 mr-0 mr-lg-3 edge-item-fix position-relative flex-wrap flex-justify-between d-flex flex-items-center ">
            <details class="HeaderMenu-details details-overlay details-reset width-full">
              <summary class="HeaderMenu-summary HeaderMenu-link px-0 py-3 border-0 no-wrap d-block d-lg-inline-block">
                Explore
                <svg x="0px" y="0px" viewBox="0 0 14 8" xml:space="preserve" fill="none" class="icon-chevon-down-mktg position-absolute position-lg-relative">
                  <path d="M1,1l6.2,6L13,1"></path>
                </svg>
              </summary>

              <div class="dropdown-menu flex-auto rounded-1 bg-white px-0 pt-2 pb-0 mt-0 pb-4 p-lg-4 position-relative position-lg-absolute left-0 left-lg-n4">
                <ul class="list-style-none mb-3">
                  <li class="edge-item-fix"><a href="/explore" class="py-2 lh-condensed-ultra d-block link-gray-dark no-underline h5 Bump-link--hover" data-ga-click="(Logged out) Header, go to Explore">Explore GitHub <span class="Bump-link-symbol float-right text-normal text-gray-light">&rarr;</span></a></li>
                </ul>

                <h4 class="text-gray-light text-normal text-mono f5 mb-2 border-lg-top pt-lg-3">Learn &amp; contribute</h4>
                <ul class="list-style-none mb-3">
                  <li class="edge-item-fix"><a href="/topics" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Topics">Topics</a></li>
                    <li class="edge-item-fix"><a href="/collections" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Collections">Collections</a></li>
                  <li class="edge-item-fix"><a href="/trending" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Trending">Trending</a></li>
                  <li class="edge-item-fix"><a href="https://lab.github.com/" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Learning lab">Learning Lab</a></li>
                  <li class="edge-item-fix"><a href="https://opensource.guide" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Open source guides">Open source guides</a></li>
                </ul>

                <h4 class="text-gray-light text-normal text-mono f5 mb-2 border-lg-top pt-lg-3">Connect with others</h4>
                <ul class="list-style-none mb-0">
                  <li class="edge-item-fix"><a href="https://github.com/events" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Events">Events</a></li>
                  <li class="edge-item-fix"><a href="https://github.community" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Community forum">Community forum</a></li>
                  <li class="edge-item-fix"><a href="https://education.github.com" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to GitHub Education">GitHub Education</a></li>
                  <li class="edge-item-fix"><a href="https://stars.github.com" class="py-2 pb-0 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to GitHub Stars Program">GitHub Stars program</a></li>
                </ul>
              </div>
            </details>
          </li>

          <li class="border-bottom border-lg-bottom-0 mr-0 mr-lg-3">
            <a href="/marketplace" class="HeaderMenu-link no-underline py-3 d-block d-lg-inline-block" data-ga-click="(Logged out) Header, go to Marketplace">Marketplace</a>
          </li>

          <li class="d-block d-lg-flex flex-lg-nowrap flex-lg-items-center border-bottom border-lg-bottom-0 mr-0 mr-lg-3 edge-item-fix position-relative flex-wrap flex-justify-between d-flex flex-items-center ">
            <details class="HeaderMenu-details details-overlay details-reset width-full">
              <summary class="HeaderMenu-summary HeaderMenu-link px-0 py-3 border-0 no-wrap d-block d-lg-inline-block">
                Pricing
                <svg x="0px" y="0px" viewBox="0 0 14 8" xml:space="preserve" fill="none" class="icon-chevon-down-mktg position-absolute position-lg-relative">
                   <path d="M1,1l6.2,6L13,1"></path>
                </svg>
              </summary>

              <div class="dropdown-menu flex-auto rounded-1 bg-white px-0 pt-2 pb-4 mt-0 p-lg-4 position-relative position-lg-absolute left-0 left-lg-n4">
                <a href="/pricing" class="pb-2 lh-condensed-ultra d-block link-gray-dark no-underline h5 Bump-link--hover" data-ga-click="(Logged out) Header, go to Pricing">Plans <span class="Bump-link-symbol float-right text-normal text-gray-light">&rarr;</span></a>

                <ul class="list-style-none mb-3">
                  <li class="edge-item-fix"><a href="/pricing#feature-comparison" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Compare plans">Compare plans</a></li>
                  <li class="edge-item-fix"><a href="https://enterprise.github.com/contact" class="py-2 lh-condensed-ultra d-block link-gray no-underline f5" data-ga-click="(Logged out) Header, go to Contact Sales">Contact Sales</a></li>
                </ul>

                <ul class="list-style-none mb-0 border-lg-top pt-lg-3">
                  <li class="edge-item-fix"><a href="/nonprofit" class="py-2 lh-condensed-ultra d-block no-underline link-gray-dark no-underline h5 Bump-link--hover" data-ga-click="(Logged out) Header, go to Nonprofits">Nonprofit <span class="Bump-link-symbol float-right text-normal text-gray-light">&rarr;</span></a></li>
                  <li class="edge-item-fix"><a href="https://education.github.com" class="py-2 pb-0 lh-condensed-ultra d-block no-underline link-gray-dark no-underline h5 Bump-link--hover"  data-ga-click="(Logged out) Header, go to Education">Education <span class="Bump-link-symbol float-right text-normal text-gray-light">&rarr;</span></a></li>
                </ul>
              </div>
            </details>
          </li>
      </ul>
    </nav>

  <div class="d-lg-flex flex-items-center px-3 px-lg-0 text-center text-lg-left">
      <div class="d-lg-flex mb-3 mb-lg-0">
          <div class="header-search header-search-current js-header-search-current flex-auto js-site-search position-relative flex-self-stretch flex-md-self-auto mb-3 mb-md-0 mr-0 mr-md-3 scoped-search site-scoped-search js-jump-to js-header-search-current-jump-to"

role=“combobox” aria-owns=“jump-to-results” aria-label=“Search or jump to” aria-haspopup=“listbox” aria-expanded=“false”

</div>

    <a href="/login?return_to=%2FPushpamk%2Fmaterialui-react-component-snippet-autocomplete%2Fblob%2Fmaster%2FREADME.md"
      class="HeaderMenu-link no-underline mr-3"
      data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;site header menu&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;SIGN_UP&quot;,&quot;originating_url&quot;:&quot;https://github.com/Pushpamk/materialui-react-component-snippet-autocomplete/blob/master/README.md&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="e1cf02362fe3fdda3f21d4c965bad7864332ed733bcaf92628e37f70a52510e6"
      data-ga-click="(Logged out) Header, clicked Sign in, text:sign-in">
      Sign&nbsp;in
    </a>
        <a href="/join?ref_cta=Sign+up&amp;ref_loc=header+logged+out&amp;ref_page=%2F%3Cuser-name%3E%2F%3Crepo-name%3E%2Fblob%2Fshow&amp;source=header-repo&amp;source_repo=Pushpamk%2Fmaterialui-react-component-snippet-autocomplete"
          class="HeaderMenu-link d-inline-block no-underline border border-gray-dark rounded-1 px-2 py-1"
          data-hydro-click="{&quot;event_type&quot;:&quot;authentication.click&quot;,&quot;payload&quot;:{&quot;location_in_page&quot;:&quot;site header menu&quot;,&quot;repository_id&quot;:null,&quot;auth_type&quot;:&quot;SIGN_UP&quot;,&quot;originating_url&quot;:&quot;https://github.com/Pushpamk/materialui-react-component-snippet-autocomplete/blob/master/README.md&quot;,&quot;user_id&quot;:null}}" data-hydro-click-hmac="e1cf02362fe3fdda3f21d4c965bad7864332ed733bcaf92628e37f70a52510e6"
          data-ga-click="Sign up, click to sign up for account, ref_page:/&lt;user-name&gt;/&lt;repo-name&gt;/blob/show;ref_cta:Sign up;ref_loc:header logged out">
          Sign&nbsp;up
        </a>
  </div>
</div>

</div>

<div data-pjax-replace id="js-flash-container">

<div>{{ message }}</div>

<div class=“application-main ” data-commit-hovercards-enabled data-discussion-hovercards-enabled data-issue-and-pr-hovercards-enabled

<div itemscope itemtype="http://schema.org/SoftwareSourceCode" class="">
<main  >

<div class="d-flex mb-3 px-3 px-md-4 px-lg-5">

    <div class="flex-auto min-width-0 width-fit mr-3">
        <h1 class=" d-flex flex-wrap flex-items-center break-word f3 text-normal">
<svg class="octicon octicon-repo text-gray mr-2" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z"></path></svg>
<span class="author flex-self-stretch" itemprop="author">
  <a class="url fn" rel="author" data-hovercard-type="user" data-hovercard-url="/users/Pushpamk/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/Pushpamk">Pushpamk</a>
</span>
<span class="mx-1 flex-self-stretch">/</span>

materialui-react-component-snippet-autocomplete

</div>

      <ul class="pagehead-actions flex-shrink-0 d-none d-md-inline" style="padding: 2px 0;">

  • Watch

  • Star

  • Fork
  • </div>
    

    More
    <ul>
                <li data-menu-item="code-tab" hidden>
                  <a role="menuitem" class="js-selected-navigation-item dropdown-item" data-selected-links=" /Pushpamk/materialui-react-component-snippet-autocomplete" href="/Pushpamk/materialui-react-component-snippet-autocomplete">
                    Code
    

  • Issues
  • Pull requests
  • Actions
  • Projects
  • Insights
  • Security
  • Permalink
    master
    <h2 id="blob-path" class="breadcrumb flex-auto min-width-0 text-normal mx-0 mx-md-3 width-full width-md-auto flex-order-1 flex-md-order-none mt-3 mt-md-0">
        <span class="js-repo-root text-bold"><span class="js-path-segment d-inline-block wb-break-all"><a data-pjax="true" href="/Pushpamk/materialui-react-component-snippet-autocomplete"><span>materialui-react-component-snippet-autocomplete</span></a></span></span><span class="separator">/</span><strong class="final-path">README.md</strong>
      </h2>
      <a href="/Pushpamk/materialui-react-component-snippet-autocomplete/find/master"
            class="js-pjax-capture-input btn mr-2 d-none d-md-block"
            data-pjax
            data-hotkey="t">
        Go to file
      </a>
    
      <details id="blob-more-options-details" class="details-overlay details-reset position-relative">
    

    <div class="Box d-flex flex-column flex-shrink-0 mb-3">
      <include-fragment src="/Pushpamk/materialui-react-component-snippet-autocomplete/contributors/master/README.md" class="commit-loader">
        <div class="Box-header Box-header--blue d-flex flex-items-center">
          <div class="Skeleton avatar avatar-user flex-shrink-0 ml-n1 mr-n1 mt-n1 mb-n1" style="width:24px;height:24px;"></div>
          <div class="Skeleton Skeleton--text col-5 ml-2">&nbsp;</div>
        </div>
    
        <div class="Box-body d-flex flex-items-center" >
          <div class="Skeleton Skeleton--text col-1">&nbsp;</div>
          <span class="text-red h6 loader-error">Cannot retrieve contributors at this time</span>
        </div>
    

    <div class="Box mt-3 position-relative
      ">
    
    62 lines (34 sloc) 2.07 KB

    MaterialUi-React-Component Snippet-Autocomplete Release

    MaterialUi-React-Component Snippet-Autocomplete Sublime Plugin

    Auto-complete plugin for MaterialUi Component props .

    Installation

    With Package Control:

    1. Run “Package Control: Install Package” command, find and install MaterialUi React Component Snippet Autocomplete plugin.
    2. Restart ST editor (if required)

    Manually:

    You can clone this repository to the Packages directory of your Sublime installation.

    Configuration

    Go to Preference > Setting add "auto_complete_selector": true

    Or

    Go to Preference > Setting add "auto_complete_triggers": [{"selector": "source.js", "characters": "mui"},{"selector": "source.js", "characters": "api"}]

    MaterialUi

    MaterialUi is a React components for faster and easier web development. Build your own design system, or start with Material Design.

    Usage

    guide-1

    Import MaterialUi Packages

    guide-2

    MaterialUi React Component Snippet

    guide-3

    more info: Components

    Props name and value autocompletion: When inside components tag (<CardMedia [HERE] />) and (variant="[HERE]"), suggestions will appear.

    guide-4 guide-5

    Note: In order for the suggestions to appear, your document needs to have the syntax set to JS. You can set the syntax from the menu View > Syntax or via the Command Palette.

    To make a new version of the plugin available via package control, a new version tag needs to be created.

    Copyright and license

    Licensed under the MIT License

    </div>
    

    <div class="Popover anim-scale-in js-tagsearch-popover"
     hidden
     data-tagsearch-url="/Pushpamk/materialui-react-component-snippet-autocomplete/find-definition"
     data-tagsearch-ref="master"
     data-tagsearch-path="README.md"
     data-tagsearch-lang="Markdown"
     data-hydro-click="{&quot;event_type&quot;:&quot;code_navigation.click_on_symbol&quot;,&quot;payload&quot;:{&quot;action&quot;:&quot;click_on_symbol&quot;,&quot;repository_id&quot;:190377524,&quot;ref&quot;:&quot;master&quot;,&quot;language&quot;:&quot;Markdown&quot;,&quot;originating_url&quot;:&quot;https://github.com/Pushpamk/materialui-react-component-snippet-autocomplete/blob/master/README.md&quot;,&quot;user_id&quot;:null}}"
     data-hydro-click-hmac="c5864e938a03f4528a9cc1c2df225f874f7a26fdc0238bb1071422a124ea0543">
    

    </main>
    

    You can’t perform that action at this time.
    <script crossorigin="anonymous" async="async" integrity="sha512-bn/3rKJzBl2H64K38R8KaVcT26vKK7BJQC59lwYc+9fjlHzmy0fwh+hzBtsgTdhIi13dxjzNKWhdSN8WTM9qUw==" type="application/javascript" id="js-conditional-compat" data-src="https://github.githubassets.com/assets/compat-bootstrap-6e7ff7ac.js"></script>
    <script crossorigin="anonymous" integrity="sha512-CxjaMepCmi+z0LTeztU2S8qGD25LyHD6j9t0RSPevy63trFWJVwUM6ipAVLgtpMBBgZ53wq8JPkSeQ6ruaZL2w==" type="application/javascript" src="https://github.githubassets.com/assets/environment-bootstrap-0b18da31.js"></script>
    <script crossorigin="anonymous" async="async" integrity="sha512-DImiAPgQTAkCA4RyCAGFFpx8gPm5ucQbIc8CPplJzZa0pVKUP6kjV+J6eoUznePOu7lTGgU7RkdwX/qsuVWV7w==" type="application/javascript" src="https://github.githubassets.com/assets/vendor-0c89a200.js"></script>
    <script crossorigin="anonymous" async="async" integrity="sha512-qX27ilvInHR3mKTaVIZkPX6/CIEr23eep5RH3SbRtJnjNXV31QAR0c5IdBV1sZhZid/VTqHAI/8yX0BCTQsSFA==" type="application/javascript" src="https://github.githubassets.com/assets/frameworks-a97dbb8a.js"></script>
    
    <script crossorigin="anonymous" async="async" integrity="sha512-98QaLrGh4KNq7KoHN0RXiRQZRS0e1Cf7xVs9DwexiWwXC8VMb6GULlHBX/tdYF6WB3gZEVJAbsArJBpABG9p2Q==" type="application/javascript" src="https://github.githubassets.com/assets/behaviors-bootstrap-f7c41a2e.js"></script>
    
      <script crossorigin="anonymous" async="async" integrity="sha512-8hScl0DkWwAjCqAQA50kQOn2QTYfPcKEyJjkKYtjGB88r9GB/6kmBBsneJPgwhW3yewwt64ABgsQGpQSLX8zpg==" type="application/javascript" data-module-id="./contributions-spider-graph.js" data-src="https://github.githubassets.com/assets/contributions-spider-graph-f2149c97.js"></script>
      <script crossorigin="anonymous" async="async" integrity="sha512-tOylDKH5chpzhE2ZsMmrE55TfOBsuEsDe2QvqJyNuSnHWi3o3WYGSctVFSF/UUZ5uTFG+QY51Fv6yCCRNhHIyA==" type="application/javascript" data-module-id="./drag-drop.js" data-src="https://github.githubassets.com/assets/drag-drop-b4eca50c.js"></script>
      <script crossorigin="anonymous" async="async" integrity="sha512-NWd7LAXOwtVgUZ3oVqERPQ/YhBfwX78oVniJg3Kjdg+b5qJfHCHGDXv2wd//lCFHSgXK2pTDtwjUrrSzxaNHLg==" type="application/javascript" data-module-id="./jump-to.js" data-src="https://github.githubassets.com/assets/jump-to-35677b2c.js"></script>
      <script crossorigin="anonymous" async="async" integrity="sha512-t81wueaXkmyFWg/8jCkbdtX8s/6GWxbdZFyZzW9yQ3DPUbVtBFWGT+1UjYUJRZSdDmhWov/w8qkAxsGTwYrubw==" type="application/javascript" data-module-id="./manage-membership.js" data-src="https://github.githubassets.com/assets/manage-membership-bootstrap-b7cd70b9.js"></script>
      <script crossorigin="anonymous" async="async" integrity="sha512-4/IFeY0KnnbEE96g3TbafnrIClyglViqArtUpkCBPSUmd3g4V6OziUCAaRGJnBQ1Uqu6/njfPWKdVqYFK4sifA==" type="application/javascript" data-module-id="./profile-pins-element.js" data-src="https://github.githubassets.com/assets/profile-pins-element-e3f20579.js"></script>
      <script crossorigin="anonymous" async="async" integrity="sha512-JXSmOrOQXof4xz7y+engxtqrugUopipC5LwEmsfxit4PlVe48UECBUCLuujjIADm1kjb2f/9/azX+qNspSy90w==" type="application/javascript" data-module-id="./randomColor.js" data-src="https://github.githubassets.com/assets/randomColor-2574a63a.js"></script>
      <script crossorigin="anonymous" async="async" integrity="sha512-FOUgzyCYz3T1et4Stcl3MeKUX3mZkQcsMsTQDgBj6/CtW3HrwyGMaCeXGyhSjTGibphNptgZKgDNkvL+O+2uYw==" type="application/javascript" data-module-id="./sortable-behavior.js" data-src="https://github.githubassets.com/assets/sortable-behavior-14e520cf.js"></script>
      <script crossorigin="anonymous" async="async" integrity="sha512-Sqqua2FOZToK8Mzg1e4jBubR6ZCFO0gL2JHjgpqafLawUXr69ffELu+IhApoX5uhWlxXxJ0ooE89ANBMtWiUNA==" type="application/javascript" data-module-id="./tweetsodium.js" data-src="https://github.githubassets.com/assets/tweetsodium-4aaaae6b.js"></script>
      <script crossorigin="anonymous" async="async" integrity="sha512-ESSJw3PgRUFa5pbcX6tK9RegCXQoksTc91dc9nAvhQwqZ3WoVtL1bvwb7bd9Z1ZVdkLgW4idJIMoB6KcvrCNNQ==" type="application/javascript" data-module-id="./user-status-submit.js" data-src="https://github.githubassets.com/assets/user-status-submit-112489c3.js"></script>
    
    <script crossorigin="anonymous" async="async" integrity="sha512-P/0jNVcAOnXKFBD2DMItd3I0mlTB0TKvyMGyrKKQUztODr0q6ppku3eh+Es23VjU0d6k6/xLQ5ms5CBUCQ/JwA==" type="application/javascript" src="https://github.githubassets.com/assets/repositories-bootstrap-3ffd2335.js"></script>
    

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.