Socket
Socket
Sign inDemoInstall

@swisspost/internet-header

Package Overview
Dependencies
6
Maintainers
0
Versions
44
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

@swisspost/internet-header

The header for client facing applications.


Version published
Weekly downloads
1K
increased by44.64%
Maintainers
0
Created
Weekly downloads
 

Readme

Source

Swiss Post Internet Header

Swiss Post Design System splash screen

The official Swiss Post Internet Header implementation, built with Stencil JS.

Documentation

The header docs are part of the storybook docs for the Design System.

Internet Header Documentation

Installation

There are two possibilities to install the header on a page.

Npm installation

Use this if your project uses a bundler or a framework like Angular, React or Vue.

npm install @swisspost/internet-header
<!-- index.html -->
<body>
  <swisspost-internet-header project="your-project-id"></swisspost-internet-header>
  ...
</body>
Lazy-loaded
// main.ts / index.js / ...
import { defineCustomElements } from '@swisspost/internet-header/loader';

defineCustomElements();
Bare component
// main.ts / index.js / ...
import '@swisspost/internet-header/dist/swisspost-internet-header/swisspost-internet-header.esm';

Basic installation

Use this if you want to use the CDN version and if you don't use a bundler or a framework. Make sure to replace {version} with the version you want to use or remove @{version} to use the latest version.

Lazy-loaded
<!DOCTYPE html>
<html>
  <body>
    <swisspost-internet-header project="your-project-id"></swisspost-internet-header>
  </body>
  <script type="module">
    import { defineCustomElements } from 'https://unpkg.com/@swisspost/internet-header@{version}/loader/index.es2017.js';

    defineCustomElements();
  </script>
</html>
Bare component
<!-- index.html -->
<head>
  <script
    async
    type="module"
    src="https://unpkg.com/@swisspost/internet-header@{version}/dist/swisspost-internet-header/swisspost-internet-header.esm.js"
  ></script>
</head>
<body>
  <swisspost-internet-header project="your-project-id"></swisspost-internet-header>
</body>

Contribute

Contributor Covenant

Considering supporting the Swiss Post Design System with your contribution? Whether you like to contribute new patterns, fix a bug, spotted a typo or have ideas for improvement - we'd love to hear from you. Learn how you can contribute to this project in the header contribution guidelines and also take a look at the general contribution guidelines.

For any questions regarding the pattern library, you can reach out on the discussions page.

In order to keep our community open and inclusive, we expect you to read and follow our Code of Conduct.

License

Software contained in this repository is published by the Swiss Post Ltd. under the Apache 2.0 License.

© 2024 Swiss Post, Ltd.

Keywords

FAQs

Last updated on 10 Jul 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc