@sparrowend/ui
TypeScript icon, indicating that this package has built-in type declarations

1.3.1 • Public • Published
Sparrow UI
An enterprise-class UI design language and React(Vue 、Svelte) UI library. Adapt to HTML, and compiled HTML.

Features

  • 🌈 Enterprise-class UI designed for web applications.
  • 📦 High quality microlibraries out of the box.
  • 🛡 Written in TypeScript with predictable static types.
  • ⚙️ Whole package of design resources and development tools.
  • 🎨 Powerful theme customization in every detail.

  • 🚌 Super adaptive ability

  • 🐍 Don't stick to any framework
  • 🆕 Support for Progressive Web Apps(PWA).

🖥 Environment Support

  • Modern browsers and Internet Explorer 11 (with polyfills)
  • Server-side Rendering
  • Electron
IE / Edge
IE / Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
Electron
Electron
IE11, Edge last 2 versions last 2 versions last 2 versions last 2 versions

📦 Install

  npm i @sparrowend/ui
  yarn add @sparrowend/ui
  pnpm add @sparrowend/ui

🔨 Usage

  • jsx

    import { Button } from '@sparrowend/ui';
    const App = () => (
    <>
        <Button type="primary">PRESS ME</Button>
    </>
    );

    And import style manually:

    import '@sparrowend/ui/dist/spui.css';
    // or
    // import '@sparrowend/ui/es/button/style';
  • html

    <html>
        <link href='dist/spui.css'></link>
        <script src="dist/spui.js"></script>
        or
        <script type="module">
            import { Message } from 'dist/spui-es.js';
            Message.error('the end');
        </script>
        <sp-button>click me</sp-button>
    </html>
  • import map

          <html>
          <link href='dist/spui.css'></link>
          <script type="importmap">
              {
                  "imports": {
                      "sparrow-ui": "dist/spui-es.js"
                  }
              }
          </script>
          <script type="module">
              import { Message } from 'sparrow-ui';
              Message.error('sucessful');
          </script>
      </html>
  • node(compile ---> any)

    • art-template
      <!--layout.art-->
      <!doctype html>
      <html>
        <head>
          <meta charset="utf-8">
            <title>{{block 'title'}}My Site{{/block}}</title>
            <link href='dist/spui.css'></link>
            <script src="dist/spui.js"></script>
      
            {{block 'head'}}
              <link rel="stylesheet" href="main.css">
            {{/block}}
      
        </head>
        <body>
            {{block 'content'}}{{/block}}
        </body>
      </html>
      {{if user}}
          <h2>{{user.name}}</h2>
          <sp-button>Thanks!</sp-button>
      {{/if}}
      • ejs 等同
占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占占

⌨️ Development

Use Gitpod, a free online dev environment for GitHub.

Open in Gitpod

Or clone locally:

$ git clone git@github.com:lianglei-git/sparrow-ui.git
$ cd sparrow-ui
$ npm install
$ npm run start

🤝 Contributing

My welcome all contributions. Please contact me at lianglei_cool@163.com

🙇 Thanks!

Package Sidebar

Install

npm i @sparrowend/ui

Weekly Downloads

1

Version

1.3.1

License

ISC

Unpacked Size

9.99 MB

Total Files

891

Last publish

Collaborators

  • sparrowend