Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@storybook/components-marketing

Package Overview
Dependencies
Maintainers
26
Versions
246
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@storybook/components-marketing

Storybook marketing component library

  • 3.0.0--canary.77.1cb3594.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
192
increased by1500%
Maintainers
26
Weekly downloads
 
Created
Source

Storybook Marketing Component Library

UI components for the Storybook marketing, docs, addons, blog and showcase sites.

NPM JavaScript Style Guide

Used by

Note: these components are not used in Storybook's UI.

Tech stack

Building components

Maintaining the system

Install

npm install --save @storybook/components-marketing

Install peer dependencies:

npm install --save @docsearch/css @storybook/theming framer-motion@7.0.0

The page header comprises of three parts: Eyerbrow, Nav, and SubNav

Eyebrow, Nav, and Footer usually live at the shared layout level whereas the SubNav is specific to each page. The SubNav can be configured in several different ways, check out its stories file for examples.

All these components support an inverse variant.

Sourcing data

Source shared DX data from https://storybook-dx.netlify.app/.netlify/functions/dx-data

  • Eyerbrow requires latestPost
  • Footer requires subscriberCount

The Nav and Footer links are configured via the LinksContextProvider. It comes with a default set of links

https://storybook-dx.netlify.app/.netlify/functions/dx-data

Styling

Eyebrow contains a Search component which depends on @docsearch/css. You need to load these styles in your app, probably at the top-most, global, level:

import '@docsearch/css';

Development Scripts

yarn release

Bump the version

Push a release to GitHub and npm

Push a changelog to GitHub

Notes:

  • Requires authentication with npm adduser
  • auto is used to generate a changelog and push it to GitHub. In order for this to work correctly, environment variables called GH_TOKEN and NPM_TOKEN are needed that reference a GitHub personal access token and a NPM "Publish" token with the appropriate permissions to update the repo.

License

MIT © storybookjs

FAQs

Package last updated on 11 Mar 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
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc