open-index/open-npm huggingface dataset:
npm package: @github1s/vscode-web
Description: VS Code web for GitHub1s
Author: github1s
Latest version: 0.27.0

# @github1s/vscode-web

This is the companion NPM package to support GitHub1s. The NPM package is [@github1s/vscode-web](https://www.npmjs.com/package/@github1s/vscode-web).

## Commands

`npm run clone` - clone the official VS Code repo.

`npm run build` - build the VS Code with the custom code under `src`.

`npm run watch` - watch the code change under `src` directory and rebuild VS Code.

## Usage

The codes in the package can be used independently, See [index.html](./index.html).

## Publish

To publish the NPM package, please make sure you have the right access via https://www.npmjs.com/ and run the following commands:

```sh
# bump the `version` field in package.json file.
npm run build && cd dist
npm publish --access public
```
npm package: @githubacct54385/learnstorybook-design-system
Description: Storybook design system
Author: Alexander Wolcott Barke
Latest version: 0.1.1

# Storybook design system tutorial

The Storybook design system tutorial is a subset of the full [Storybook design system](https://github.com/storybookjs/design-system/), created as a learning resource for those interested in learning how to write and publish a design system using best in practice techniques.

Learn more in [Storybook tutorials](https://storybook.js.org/tutorials/).
npm package: @githublinker/filetype
Description: Find a file type according to a filename or extension
Author: Stefan Buck
Latest version: 0.1.0

# Filetype
[![NPM version][npm-image]][npm-url] [![Build Status][travis-image]][travis-url] [![Dependency Status][daviddm-url]][daviddm-image]


Find a file type according to a filename or extension

[npm-url]: https://npmjs.org/package/filetype
[npm-image]: https://badge.fury.io/js/filetype.svg
[travis-url]: https://travis-ci.org/github-linker/filetype
[travis-image]: https://travis-ci.org/github-linker/filetype.svg?branch=master
[daviddm-url]: https://david-dm.org/github-linker/filetype.svg?theme=shields.io
[daviddm-image]: https://david-dm.org/github-linker/filetype
npm package: @githubnext/blocks
Description: Welcome! This package supports local development of custom GitHub Blocks.
Latest version: 2.3.5

# blocks

Welcome! This package supports local development of custom GitHub Blocks.

# Scripts

Using the `blocks` command, you can run the following commands:

- `start` - Starts a local development environment and builds Blocks bundles.
- `build` - Builds Blocks bundles.

# Utility functions

To reduce the cognitive load associated with writing file and folder block components, we've assembled a helper library that exposes interface definitions and a few helper functions.

## How to use

`yarn add @githubnext/blocks`

```tsx
import {
  FileBlockProps,
  FolderBlockProps,
  getLanguageFromFilename,
  getNestedFileTree,
} from '@githubnext/blocks`
```

## FileBlockProps

```tsx
import { FileBlockProps } from '@githubnext/blocks';

export default function (props: FileBlockProps) {
  const { content, metadata, onUpdateMetadata } = props;
  ...
}
```

## FolderBlockProps

```tsx
import { FolderBlockProps } from '@githubnext/blocks';

export default function (props: FileBlockProps) {
  const { tree, metadata, onUpdateMetadata, BlockComponent } = props;
  ...
}
```

## getLanguageFromFilename

A helper function that returns the "language" of a file, given a valid file path with extension.

## getNestedFileTree

A helper function to turn the flat folder `tree` array into a nested tree structure

import { FolderBlockProps, getNestedFileTree, } from "@githubnext/blocks";

```tsx
export default function (props: FolderBlockProps) {
  const { tree, onNavigateToPath } = props;

  const data = useMemo(() => {
    const nestedTree = getNestedFileTree(tree)[0]
    return nestedTree
  }, [tree])
  ...
}
```